Question

我有一个选择输入，可以让我在这些对象之间做出选择：

$scope.items = [{"id": "0", "name": "AAA"},
                {"id": "1", "name": "BBB"},
                {"id": "2", "name": "CCC"}]

我需要存储Id并在选择框中显示name属性，或者当Id已经存储在要修改的对象中时。

对象：

$scope.object

我有这个html代码，它将选定的项目ID存储在$ scope.object.itemId中没有问题，但选择的项目名称在选择输入时没有显示，或者已被选中。

<select ng-model="object.itemId"
        ng-options="item.id as item.name for item in items track by item.id">
</select>

请注意，选择列表已正确填充项目名称。

谢谢你的帮助！

Answer 1

使用typeahead-input-formatter并从中返回要显示为所选值的值。像这样的东西

   <select.... typeahead-input-formatter="itemchosen($model)"

然后

    $scope.itemchosen = function(id) {

         var theItem = jQuery.grep(items,function(p) { return p.id == id };
         return theItem.name;

   };

Answer 2

好的，这是Angularjs开发人员发现的最佳解释：https://github.com/angular/angular.js/issues/6564/#issuecomment-51615589

简而言之：您无法将track by与select结合使用。使用其中一种。

以上链接中提供的示例（为方便起见，此处复制）：

有两种不同的用例：

<强> 1。你想要一个丑陋价值的闪亮演示

使用值作为标签：

items = [
  {value: 1, label: 'One'},
  {value: 2, label: 'Two'},
]

template = 'ng-options="item.value as item.label for items"'

当您更改下拉列表时，模型将分配给您在as前面定义的任何内容。

<强> 2。您想迭代复杂的对象

使用追踪：

items = [
  {id: 1, ...},
  {id: 2, ...},
  {id: 3, ...},
]

template = 'ng-options="item as item.label for items track by items.id"'

更改下拉列表时，会为模型分配item。 track by表达式仅用于通过value

上的<option>属性将项目与项目相关联

Angularjs（select）：显示数组中的其他属性，而不是存储在ng-model中的属性

2 个答案: