AngularJS，您可以創建基於數組或對象的項目下拉列表。
創建一個選擇框使用NG選項
如果你想創建一個下拉列表，基於對象或AngularJS陣列上，你應該使用ng-option指令：
例
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectedName"
ng-options="x for x in names">
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope) {
$scope.names = ["Emil", "Tobias",
"Linus"];
});
</script>
試一試» NG選項VS NG-重複
您也可以使用ng-repeat指令做出同樣的下拉列表：
因為ng-repeat指令重複的用於在陣列的每個項目的HTML代碼的塊，它可以用於創建在下拉列表中的選項，但ng-options指令是特別為填充選項的下拉列表製成，並具有的至少一個重要的優點：
用由下拉菜單ng-options允許選定的值是一個對象 ，而製成的下拉列表ng-repeat必須是一個字符串。
我應該使用什麼？
假設你有對象的數組：
$scope.cars = [
{model : "Ford Mustang", color :
"red"},
{model : "Fiat 500", color : "white"},
{model : "Volvo XC90", color : "black"}
]; 在ng-repeat指令有它的局限性，所選擇的值必須是一個字符串：
例
採用ng-repeat ：
<select ng-model="selectedCar">
<option ng-repeat="x in cars" value="{{x.model}}">{{x.model}}</option>
</select>
<h1>You selected: {{selectedCar}}</h1>
試一試» 當使用ng-options指令，選擇的值可以是一個對象：
例
使用ng-options ：
<select ng-model="selectedCar" ng-options="x.model for x in cars">
</select>
<h1>You selected: {{selectedCar.model}}</h1>
<p>It's color is: {{selectedCar.color}}</p>
試一試» 當選擇的值可以是一個對象，它可以存儲更多的信息，您的應用程序可以更加靈活。
我們將使用ng-options指令在本教程中。
數據源作為一個對象
在前面的例子中的數據源是一個數組，但是我們也可以使用一個對象。
假設你有鍵值對的對象：
$scope.cars = {
car01 : "Ford",
car02 : "Fiat",
car03 : "Volvo"
}; 在表達ng-options屬性是對象有點不同：
例
使用對象作為數據源， x表示鍵， y表示的值：
<select ng-model="selectedCar" ng-options=" x for (x, y) in cars ">
</select>
<h1>You selected: {{selectedCar}}</h1>
試一試» 所選的值將永遠是在鍵盤值對的值 。
在一個鍵盤值對中的值也可以是一個對象：
例
所選的值將仍然是一個鍵盤值對的價值 ，只是這一次它是一個對象：
$scope.cars = {
car01 : {brand : "Ford", model : "Mustang", color :
"red"},
car02 : {brand : "Fiat", model : "500", color : "white"},
car03 : {brand : "Volvo", model : "XC90", color : "black"}
};
試一試» 在下拉列表中的選項沒有在一個關鍵的-值對的密鑰 ，也可以是數值，或值對象的屬性：