关于AngularJS的ng-options指令

定义和用法

ng-options 可以使数组或对象来生成一个<select>中的<option>列表。
当select中一个选项被选择，该选项将会被绑定到ng-model。
除了ng-options 指令外，还可以使用 ng-repeat 来替代。

使用情景

ng-options 如何遍历对象我不清楚，主要还是作用与数组。
后台将一个List<DTO对象>以json的形式传到前台，通过回调函数得到的就是一个数组对象。这时候 ng-options 就派上用场了。

具体使用

html

<div ng-app="myApp" ng-controller="myCtrl">

<select ng-model="selectedName" ng-options="item.code as item.message for item in names" ng-change="change()">
	<option value="">请选择</option>
</select>

</div>

注：<select>是可以有默认值的，如<option value="">请选择</option>, 但前提是value必须等于"",不可以有任何值。

controller

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.names = [
		{message:"Emil", code:1}, 
		{message:"Tobias", code:2}, 
		{message:"Linus", code:3}
	];
	
	$scope.change = function(){
	    console.log("value="+$scope.selectedName);
	}
});

详解

首先，ng-options="item.code as item.message for item in names"
表示遍历$scope.names数组，得到每个item对象；
然后，item.code作为option的value，item.message作为option的text.

而ng-model, 其实就是option的value.