为 ng-options 绑定选择元素设置选定的值 [英] Setting selected values for ng-options bound select elements
问题描述
摆弄相关代码:http://jsfiddle.net/gFCzV/7/
我正在尝试设置绑定到 ng-repeat 中引用的对象的子集合的下拉列表的选定值.我不知道如何设置所选选项,因为我无法以我所知道的任何方式引用它绑定到的集合.
HTML:
<div ng-repeat="人物中的人物"><div class="listheader">{{Person.firstName}} {{Person.lastName}}</div><div class="listitem" ng-repeat="Choice in Person.Choices">{{Choice.Name}}:<选择ng-model="Choice.SelectedOption"ng-options="choice.Name for choice in Choice.Options"></select>{{Choice.SelectedOption.ID}}
JS:
var myApp = angular.module('myApp', []);myApp.controller("SomeController", function($scope) {$scope.People = [{"firstName": "约翰","lastName": "母鹿",选择":[{"名称":"晚餐","选项":[{名称:"鱼",ID:1}, {名称:"鸡肉",ID:2}, {名称:"牛肉",ID:3}],"SelectedOption":{Name:"Chicken",ID:2}//这不起作用},{"名称":"午餐","选项":[{名称:"通心粉",ID:1}, {名称:"PB&J",ID:2}, {名称:"鱼",ID:3}],"选定选项":""}],}, {"firstName": "简",姓氏":母鹿"}];});
这是我实际上应该在模型上使用带有 SelectedIndex 的 ng-init 的一种情况吗?
如果使用 AngularJS 1.2,您可以使用 'track by' 来告诉 Angular 如何比较对象.
<选择ng-model="Choice.SelectedOption"ng-options="choice.Name for choice in Choice.Options track by choice.ID"></选择>
更新小提琴 http://jsfiddle.net/gFCzV/34/
Fiddle with the relevant code: http://jsfiddle.net/gFCzV/7/
I'm trying to set the selected value of a drop down that is bound to a child collection of an object referenced in an ng-repeat. I don't know how to set the selected option since I can't reference the collection it's being bound to in any way that I'm aware of.
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>
JS:
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"
}];
});
Is this the one case where I should actually be using ng-init with a SelectedIndex on the model?
If using AngularJS 1.2 you can use 'track by' to tell Angular how to compare objects.
<select
ng-model="Choice.SelectedOption"
ng-options="choice.Name for choice in Choice.Options track by choice.ID">
</select>
Updated fiddle http://jsfiddle.net/gFCzV/34/
这篇关于为 ng-options 绑定选择元素设置选定的值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!