2017-01-16 40 views
2

我需要从ajax加载的数据中选择combobox中的选项。该数据出现在对象列表中。问题在于ng-option通过引用比较对象,因此将模型设置为对象元素结果在组合框中显示新的空选项,而不是选择正确的选项。Angular 1.5“track by”Ruines binding in ng-options

已知的解决方法是使用track by表达式。 这里是示例代码:

var myApp = angular.module("myApp", []); 

myApp.controller("myCtrl", function($scope) { 

    $scope.roles =[ 
    { key:"administrator", value:"ROLE_ADMIN" }, 
    { key:"operator", value:"ROLE_OPERATOR" }, 
    ]; 

    // this emulates data from server 
    // won't work without 'track by' 
    $scope.role={ key:"administrator", value:"ROLE_ADMIN" }; 

}); 

模板:

<body ng-app="myApp" ng-controller="myCtrl"> 
0: <input ng-model="roles[0].key" /> 
<br> 
1: <input ng-model="roles[1].key" /> 

<br> 
    select role: <select ng-model="role" ng-options="r.key for r in roles track by r.value"> 
    </select> 

    <pre>selected role={{role|json}}</pre> 
</body> 

这里出现了另一个问题。当人们在组合框中选择角色,然后 将其更改为文本框中的“键”属性时,所选角色保持不变。所以它看起来像绑定突然被打破。

https://jsfiddle.net/xLqackxw/8/

+0

它会工作如果你把ngOptions改成'