AngularJS Select(选择框)

1.使用ng-options创建选择框

<div ng-app="myApp" ng-controller="myCtrl">
 
<select ng-init="selectedName = names[0]" 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 = ["Google", "Runoob", "Taobao"];
});
</script>

2.使用ng-repeat创建选择框

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

<select>
<option ng-repeat="x in names">{{x}}</option>
</select>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.names = ["Google", "Runoob", "Taobao"];
});
</script>


ng-repeat 指令是通过数组来循环 HTML 代码来创建下拉列表,但 ng-options 指令更适合创建下拉列表,它有以下优势:

使用 ng-options 的选项是一个对象, ng-repeat 是一个字符串。


猜你喜欢

转载自blog.csdn.net/m0_37829710/article/details/80827116