Question

这是我的数据：

var markers = {
        "example": {"lat": -83.68088192646843, "lng": -125.270751953125, "type": "town"},
        "anotherexample": {"lat": -58.1548020417031, "lng": -21.318115234375, "type": "town"}
}

如何参考此数据来源？

编辑：

方法是：

$('.thing').typeahead({source: markers});

但这不起作用，我认为这是因为markers不是选择我的标记对象的正确语法。我该怎么用？

Answer 1

您可以尝试以某种方式序列化对象。在我的example (jsfiddle)中，我连接了每个条目以获得某个字符串：

var markers_as_str = Array();
for(var index in markers) {
    var marker = markers[index];
    var str = index+" : "+marker.lat+" "+marker.lng+" "+marker.type;
    markers_as_str.push(str);
}

$('#strs').typeahead({
    source: markers_as_str
});

您可以自定义matcher和sorter选项以检查特定属性。但是您在显示选项时会遇到困难，因此您必须覆盖updater选项。所有这些都会有点太过分，因为你可能不需要它。

Answer 2

我用过这个：

names = []; 
for (var k in markers) {
    if (markers.hasOwnProperty(k)) {
        names.push(k);
    }
}

Answer 3

我写了一篇关于此事的博文，How to use rich objects and typed objects with Bootstrap Typeahead。关键是将对象键入一个具有toString()方法序列化的类和一个fromString()方法进行反序列化（在Bootstrap Typeahead updater函数中用于引用一个对象原始类型）。在我的博客中，我使用UsState作为示例：

UsState.prototype.toString = function() {
    return JSON.stringify(this);
};

UsState.fromString = function(serializedState) {
    return $.extend(new UsState(), JSON.parse(serializedState));
};

然后在updater的Typeahead定义中：

updater: function(state) {
    state = UsState.fromString(state);
    $stateMessage.html('<strong>' + state.name + '</strong> has ' + state.numElectoralVotes + ' electoral votes.');
    return state.name;
},

请注意正确处理对象的其他Typeahead方法的定义：

highlighter: function(state) {
    return $.fn.typeahead.Constructor.prototype.highlighter.call(this, state.name);
},

如何引用bootstrap-typeahead的数据？

3 个答案: