Question

我正在尝试使用Angular Typeahead，我尝试呈现的数据来自$ http调用。它是一组对象，例如[{“abbrev”：“FL”，“state”：“Florida”}，{“abbrev”：“VA”，{“state”：“Virginia”}]。 html看起来像这样

<input type="text" ng-model="selected" typeahead="item.state for item in states" typeahead-editable="false" />.

该控件的工作原理是它从Web服务检索列表，当用户选择状态时，它正确填充文本输入并将状态名称存储在$ scope.selected变量中。但是我想要存储的是对象{“abbrev”：“FL”，“state”：“Florida”}因为我想在数据库中保存键/值对。我怎样才能选择一个对象而不仅仅是值？

Answer 1

这可以通过将整个对象实际存储到$scope.selected来完成。它看起来像这样：

<input type="text" ng-model="selected" typeahead="item for item in states" typeahead-editable="false" typeahead-input-formatter="item.state" typeahead-template-url="results.html" />.

需要做出的改变是：

返回整个项目：typeahead="item for item in states"
格式化输入以显示状态：typeahead-input-formatter="item.state"
添加模板：typeahead-template-url="results.html"

然后，在HTML中，您可以定义自动填充模板以显示州名称：

<script type="text/ng-template" id="results.html">
    <a>{{match.model.state}}</a>
</script>

Angular Typeahead需要捕获对象

1 个答案: