AngularJs全选反选的代码

来源：互联网发布：linux怎么设置搜狗编辑：程序博客网时间：2024/06/06 01:24

<body ng-app="myapp" ng-controller="mycn">
<div class="div">
商品名<input type="text" ng-model="name" ng-init="你猜"/>
价格<input type="text" ng-model="price"/>
数量<input type="text" ng-model="count" />
<input type="button" value="添加" ng-click="myadd()"/><br /><br />
<input type="button" value="批量删除" ng-click="pshan()"/>

<input type="button" value="反选" ng-click="fx()"/>
<table border="1" cellspacing="1" cellpadding="0" width="400px">
<tr align="center">
<td><input type="checkbox" ng-click="quanxuan()" ng-model="quan" /></td>
<td>商品名</td>
<td>价格</td>
<td>数量</td>
<td>操作</td>
</tr>
<tr ng-repeat="x in myname" align="center">
<td><input type="checkbox" ng-model="x.flog" ng-click="xuanzhong($index)" /></td>
<td>{{x.name}}</td>
<td>{{x.price}}</td>
<td>{{x.count}}</td>
<td><input type="button" value="删除" ng-click="shanchu($index)"/></td>
</tr>
</table>
</div>
</body>
<script>
var app=angular.module("myapp",[]);
app.controller("mycn",function($scope){

//$scope.myname=[{"flog":false,"name":"名称","price":"价格","count":"数量"}];
$scope.myname=[];

$scope.myadd=function(){
//文本框里面的值
var name1={"flog":false,"name":$scope.name,"price":$scope.price,"count":$scope.count};

$scope.myname.push(name1);
$scope.goods.unshift();//向第一个位置添加

}

//删除的代码
$scope.shanchu=function($index){

$scope.myname.splice($index,1)

}

//批量删除的代码
$scope.pshan=function(){
for (var i=$scope.myname.length-1;i>=0;i--) {
var my=$scope.myname[i];
if(my.flog){
$scope.myname.splice(i,1)

}
}

$scope.quan=false;

}

//测试选中的代码
$scope.xuanzhong=function($index){
//$scope.myname[$index].flog=!$scope.myname[$index].flog;
//alert($scope.myname[$index].flog)
if($scope.myname[$index].flog==false){
$scope.quan=false;
}if ($scope.myname[$index].flog==true){
$scope.quan=true;
}

}

//全选的代码
$scope.quanxuan=function(){

if($scope.quan){

for(var i=0;i<$scope.myname.length;i++){

$scope.myname[i].flog=true;
}

}else{

for(var i=0;i<$scope.myname.length;i++){

$scope.myname[i].flog=false;
}

}

}

//反选的代码
$scope.fx=function(){

for(var i=0;i<$scope.myname.length;i++){
$scope.myname[i].flog=!$scope.myname[i].flog;
}


}

})
</script>

阅读全文

0 0