AngularJSng-optionsディレクティブ
例
配列の項目を使用して、ドロップダウンリストにオプションを入力します。
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectedName"
ng-options="item for item in names"></select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope) {
$scope.names = ["Emil", "Tobias",
"Linus"];
});
</script>
定義と使用法
ディレクティブはng-options、<select>要素を<options>で埋めます。
ng-optionsディレクティブは配列を使用してドロップダウンリストを埋めます。多くの場合、ディレクティブを使用する方が簡単ですが、ng-repeat
ディレクティブを使用する方が柔軟性がありますng-options
。
構文
<select ng-options="array expression"></select>
<select>要素でサポートされています。
パラメータ値
| Value | Description |
|---|---|
| array expression | An expression that selects the specified parts of an array to fill the
select element. Legal expressions: label for value in array select as label for value in array label group by group for value in array label disable when disable for value in array label group by group for value in array track by expression label disable when disable for value in array track by expression label for value in array | orderBy expression track by expression |