javascript - Angularjs select 未将匹配模型标记为已选择

Question

我的 ngModel 在选择时遇到问题，没有显示为选定的。 id 和 name 都匹配，但不起作用，请参阅 selectedState。将模型指向选项数组中的实际对象是可行的，请参阅 selectedState2。不知道发生了什么......

fiddle : http://jsfiddle.net/fedorsmirnoff/b49n4Ldp/2/

<select ng-model="selectedState" ng-options="state.name for state in stateOptions"></select>

<select ng-model="selectedState2" ng-options="state.name for state in stateOptions"></select>

function MainCtrl($scope) {
 $scope.stateOptions = [
     {id: 1, name: "Alaska"},
     {id: 2, name: "Montana"},
     {id: 3, name: "Nebraska"},
     {id: 4, name: "Texas"}
  ]

 $scope.selectedState = {id: 2, name: "Montana"};

 $scope.selectedState2 = $scope.stateOptions[1];

}

Answer 1

这是因为每个对象都有 Angular 提供的自己的 $hashKey，Angular 使用它来确定它们是否相同。您正在 $scope.selectedState 上创建一个新对象(具有不同的 $hashKey)。您在 $scope.selectedState2 上设置它的方式是正确的。

您还可以使用 track by 通过 state.id 而不是对象的 $hashKey 进行 Angular 跟踪:

<select ng-model="selectedState" ng-options="state.name for state in stateOptions track by state.id"></select>