Angularjs 设置ng选项绑定的选定元素的选定值

Angularjs 设置ng选项绑定的选定元素的选定值,angularjs,ng-options,Angularjs,Ng Options,修改相关代码: 我试图设置下拉列表的选定值,该下拉列表绑定到ng repeat中引用的对象的子集合。我不知道如何设置所选选项,因为我无法以我知道的任何方式引用它绑定到的集合 HTML: <div ng-app="myApp" ng-controller="SomeController"> <div ng-repeat="Person in People"> <div class="listheader">{{Person.firstNa

修改相关代码:

我试图设置下拉列表的选定值,该下拉列表绑定到ng repeat中引用的对象的子集合。我不知道如何设置所选选项,因为我无法以我知道的任何方式引用它绑定到的集合

HTML

<div ng-app="myApp" ng-controller="SomeController">
    <div ng-repeat="Person in People">
        <div class="listheader">{{Person.firstName}} {{Person.lastName}}</div>
        <div class="listitem" ng-repeat="Choice in Person.Choices">
            {{Choice.Name}}: 
            <select 
                ng-model="Choice.SelectedOption"                 
                ng-options="choice.Name for choice in Choice.Options"></select>
            {{Choice.SelectedOption.ID}}
        </div>
    </div>
</div>
var myApp = angular.module('myApp', []);
myApp.controller("SomeController", function($scope) {
    $scope.People = [{
        "firstName": "John",
        "lastName": "Doe",
        "Choices": [
            {
                "Name":"Dinner",
                "Options":[{Name:"Fish",ID:1}, {Name:"Chicken",ID:2}, {Name:"Beef",ID:3}],
                "SelectedOption":{Name:"Chicken",ID:2} //this doesn't work
            },
            {
                "Name":"Lunch",
                "Options":[{Name:"Macaroni",ID:1}, {Name:"PB&J",ID:2}, {Name:"Fish",ID:3}],
                "SelectedOption":""
            }
        ],        
    }, {
        "firstName": "Jane",
        "lastName": "Doe"
    }];
});

在这种情况下,我真的应该在模型上使用带有SelectedIndex的ng init吗?

您可以使用
ID
字段作为相等标识符。在这种情况下不能使用adhoc对象,因为AngularJS在比较对象时会检查引用相等性

<select 
    ng-model="Choice.SelectedOption.ID" 
    ng-options="choice.ID as choice.Name for choice in Choice.Options">
</select>

如果使用AngularJS 1.2,您可以使用“跟踪方式”告诉Angular如何比较对象

<select 
    ng-model="Choice.SelectedOption"                 
    ng-options="choice.Name for choice in Choice.Options track by choice.ID">
</select>


使用所选值的ng selected更新了fiddle

。我已经成功地在AngularJSV1.3.2中实现了代码


{{c.StateName}

表达式语法中的“track by”子句正是我想要的。谢谢<代码>跟踪方式帮助我消除了选择ng的必要性,它不能与ng选项一起使用(+1)哦,真奇怪。这也解决了我的问题,但我不明白为什么。“choice.ID as choice.name for…”这句话不管用了吗?谢谢Richard先生!:)跟踪完成任务!这很可能会更新父实体的id,并在尝试保存子实体时触发约束冲突异常。更新父实体id属性将使持久层尝试使用另一个实体id保存它。对于angular>=1.2,正确答案是@richard houltz one。你保存了我的一天。谢谢