您的位置：首页 > Web前端 > AngularJS

angularjs ng-select ng-options 默认选中项.

2016-02-02 20:59 671 查看

<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div ng-controller="CityController">
<select ng-model="city" value="city.id" ng-options="city.name for city in cities" >
<option value="">Choose City</option>
</select>
<span ng-bind-template="Best City:{{city.name}},id:>>{{city.id}}">
</span>
</div>
</body>
<script type="text/javascript" src="js/angularJs-1.2.16-min.js" ></script>
<script type="text/javascript">
angular.module("myApp",[])
.controller("CityController",function($scope){

$scope.cities=[
{name:"合肥",id:2},
{name:"北京",id:3},
{name:"上海",id:4},
{name:"舒城",id:5},
{name:"纽约",id:6},
{name:"络上几",id:7}
];

for(var i in $scope.cities){
if($scope.cities[i].id==4){//将d是4的城市设为选中项.
$scope.city=$scope.cities[i];
break;
}
}
});

</script>
</html>

注意:

1.这里的的value不是我们给的值.而是循环的索引.

2.ng-model绑定我们的选中项.

3.默认选中项要在controler中指定,并且要和ng-model关联.

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航