angularJs 的checbox的级联 和 select的级联。。
angularJs的checbox的级联和select的级联。。希望能给段代码。。。。谢谢了...
angularJs 的checbox的级联 和 select的级联。。希望能给段代码。。。。谢谢了
展开
1个回答
展开全部
<!doctype html>
<html ng-app="demo">
<head>
<meta charset="UTF-8">
<title>angularjs</title>
</head>
<body>
<div ng-controller="CheckboxCtrl">
<label for="chkAll">全选:</label><input id="chkAll" type="checkbox" ng-model="chkall" ng-click="chkAll(chkall)"/>
<div ng-repeat="item in chkArr">
<input type="checkbox" ng-model="item.checked"/>{{item.text}}
</div>
<div>你选中的是:{{choseArr}}</div>
</div>
<hr/>
<div ng-controller="SelectCtrl">
<select ng-model="selectMod" ng-options="o.id as o.text for o in select1" ng-change="selChange(selectMod)">
<option value="">-- 请选择 --</option>
</select>
<select ng-model="selectMod2" ng-options="o.id as o.text for o in select2">
<option value="">-- 请选择 --</option>
</select>
</div>
</body>
</html>
javascript：
<script src="这里填写你本地的地址angularjs/1.0.8/angular.min.js"></script>
<script type="text/javascript">
var demo = angular.module('demo', []);
demo.controller('CheckboxCtrl', function($scope, $filter){
$scope.chkall = false;
$scope.chkArr = [
{id: 1, text: "足球",checked: false},
{id: 2, text: "蓝球",checked: false},
{id: 3, text: "乒乓球",checked: false},
{id: 4, text: "网球",checked: false}
];
$scope.chkAll = function(checked){
angular.forEach($scope.chkArr, function(value, key){
value.checked = checked;
});
};
$scope.$watch('chkArr', function(nv, ov){
if(nv == ov){
return;
}
$scope.choseArr = [];
angular.forEach(
$filter('filter')(nv, {checked: true}), function(v) {
$scope.choseArr.push(v.text);
});
$scope.chkall = $scope.choseArr.length == $scope.chkArr.length;
}, true);
});
//ajax请求省略
$scope.select1 = [
{id: 1, text: "不同的数据"},
{id: 2, text: "今天是周一"}
];
$scope.selChange = function(id){
//这里应该ajax请求返回一个list就是下面的$scope.select2
$scope.select2 = [
{id: 1, text: "不同数据1"},
{id: 2, text: "又周二"}
];
}
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
