ngOptions - 如何按字段 Select 一个项目？

Question

我有一系列项目：

$scope.items = [{description: "Item One", id: 1}, 
                {description: "Item Two", id: 2},
                {description: "Item Three", id: 3}]

我希望用户能够从下拉菜单（ngOptions 或 typeahead）中 select item.description，在下拉菜单中显示描述，但将 id 绑定到模型。我试过这个（注意，它与 ng-if 完全相同）：

typeahead="item.id as item.description for item in items"

在我看来，这似乎是说："For each item in items, select the item.id, but show it it as item description." 这不起作用，一旦一个项目被 selected，dropdown/typeahead 变为 item.id连同模型：PLNKR。我该如何防止这种情况？（请注意，模型 selecting id 是所需的行为，输入字段更改为项目。id/model 不是。我希望它保持为 item.description）。

OdeToCode 的权威教程没能救我。

Answer 1

ng选项：

<pre>Model: {{selected | json}}</pre>    
<select ng-model="selected" ng-options="item.id as item.description for item in items |
         filter:$viewValue | limitTo:8" class="form-control">
</select>

http://plnkr.co/edit/nuWMSCND7U3sZoFDZ7Gh?p=preview

提前输入：

<pre>Model: {{selected.id | json}}</pre>
<input type="text" ng-model="selected" typeahead="item as item.description for item in items |
filter:$viewValue | limitTo:8" class="form-control"/>

http://plnkr.co/edit/s1tJ8fwkqoJAIpXDeW2B?p=preview

ngOptions - 如何按字段 Select 一个项目？

ngOptions - How to Select an Item by Its Field?

angularjs

angular-ui-bootstrap