我正在尝试使用对象数组
(array = [{name: 'Moe', id:1}, {name: 'Larry', id:2}, {name: 'Curly', id:3}])
作为AngularJS输入表单中的下拉选项,我需要一个例子。任何人都可以指向一个可以启发我的jsFiddle吗?
答案 0 :(得分:87)
我建议您尽可能使用ng-options。
<select ng-model="choice" ng-options="x.id as x.name for x in array"></select>
因为请查看:您可以使用它来选择实际对象:
app.controller('ExampleCtrl', function($scope) {
$scope.items = [
{ id: 1, name: 'Foo' },
{ id: 2, name: 'Bar' }
];
$scope.selectedItem = null;
});
<div ng-controller="ExampleCtrl">
<select ng-model="selectedItem"
ng-options="item as item.name for item in items"></select>
{{selectedItem | json}}
</div>
在上面的示例中,当您从下拉列表中选择某些内容时,它实际上是在selectedItem上设置整个对象引用,而不仅仅是值类型。
注意:使用ng-options将value=""
属性设置为集合中项目的索引这是设计。
这是最好的方法。
编辑:根据要求提供更多上下文。还here's a plunker showing it in use
答案 1 :(得分:21)
<select ng-model="choice">
<option ng-repeat="obj in array" value="{{obj.id}}">{{obj.name}}</option>
</select>
或使用'ng-options' - http://docs.angularjs.org/api/ng.directive:select
答案 2 :(得分:2)
<dropdown-multiselect pre-selected="member.roles" model="selected_items" options="roles"></dropdown-multiselect>
<pre>selected roles = {{selected_items | json}}</pre>