Question

这是我的json对象：

 $scope.todos = [{
    name: 'angular',
    field: ['a', 'b', 'c', 'd'],
    id: 1
  }, {
    name: 'asd',
    field: ['a', 'b', 'c', 'd', 'e'],
    id: 2
  }];

我将select作为：

<select ng-model="dashboard.type" ng-options="item as item.name for item in todos track by item.name"></select>

现在，当选择一个选项时，我想要另一个选择，它在前一个选择的ngModel上进行迭代。接下来是：

<select ng-model="dashboard.label" ng-options="item as item for item in dashboard.type.field"></select>

当我手动选择选项但在我的脚本中它们是dashboard.type中的值（例如：$scope.dashboard.type.name = 'qwe'）时它工作正常，它使用track by选择选项并将其保存在dashboard.type，而不是保存整个对象，它只保存track by选项中使用的值。

dashboard.type的值：

当我手动选择选项时： {"name":"qwe","field":["a","b","c","d","f"],"id":3}
使用track by时： {"name":"qwe"}

注意：我无法使用track by item。它必须是对象item的属性。它可以是name或id。

这里是plnkr。

修改：

正如许多人所指出的，我想澄清一下，我无法将对象初始化为todos列表的任何值。这是因为dashboard.type.name值每次都不同，todos列表从10到100个对象不等。现在我必须迭代列表todos检查是否todos[index].name==someName并分配相关对象。我正在积极地试图避免这种情况（因为必须有更好的方法）。

注意：我也尝试使用ng-change并将实际对象分配给dashboard.type.name，但仅在手动选择选项时才有效，这似乎已经正常工作。在使用track by时，它不会分配对象。

重要提示： $scope.dashboard.type.name = 'qwe'只是一个例子。 $scope.dashboard.type.name的值可能会在每次加载页面时发生变化。

Answer 1

这个问题不是因为跟踪而已。通过$scope.dashboard.type.name = 'qwe'设置默认值会使ng-model看起来像$scope.dashboard.type = {name : 'qwe'}。您应该使用$scope.dashboard.type = $scope.todos[2];，而不是以这种方式选择默认值。这将确保整个对象设置为$scope.dashboard.type。

Edited plunker

Answer 2

要使用默认值初始化模态，可以使用ng-init。例如

 <select ng-init="dashboard.type = todos[2]" ng-model="dashboard.type" ng-options="item as item.name for item in todos track by item.name">
  </select>

Answer 3

在ng-init上调用此函数在HTML中

ng-init ="initialize();"

在js

$scope.dashboard={};//initialize object
$scope.dashboard.type ={}//initialize object

$scope.initialize =function(){


//no need to iterate if it is certain that your Id and index is always same suppose your initial id is 3

//then
var currId =3;//suppose initial id is there
$scope.dashboard.type =$scope.todos[currId]

}

这里是codepen http://codepen.io/vkvicky-vasudev/pen/MeexmK

AngularJS ngOptions track by未将整个对象设置为ngModel

3 个答案: