ng-options指令用于使用 填充 元素的选项。
最常见的用法是使用数组填充:如
<select ng-model="selectedName" ng-options="item.name for item in items">
$scope.items= ["Emil","Tobias","Linus"];
</select>
此时的item作为$scope.selectedName 的值
当数组中每一项都是对象时:
<select ng-model="selectedName" ng-options="item.name as item.name for item in items">
$scope.items = [{name:"Emil",age:"12"},
{name:"Tobias",age:"13"},
{name:"Linus",age:"14"}];
</select>
此时使用item.name as(可选) 将item.name作为$scope.selectedName ,item.name for将name 的值设置为options下拉中的可见选项。
那如果我下拉选项中想显示多个信息呢?例如将name和age显示为“Emil(12)” 的格式呢?可以使用如下办法:
<select ng-model="selectedName" ng-options="item.name as item.name+' (' + item.age + ')' for item in items">
</select>
$scope.items = [{name:"Emil",age:"12"},
{name:"Tobias",age:"13"},
{name:"Linus",age:"14"}];
</select>
结果如下:
当然啦,我们也可以用来遍历对象
<select ng-model="selectedName" ng-options="x for (x,y) in items">
</select>
$scope.items = {Emil:"12",Tobias:"13",Linus:"14"}
</select>