Angularjs to realize the complete selection of reverse function _angularjs

Angularjs is designed to overcome the lack of HTML in building applications. HTML is a good declarative language for static text presentation, but it is weak to build a Web application. So I did some work (you can also think of it as a gimmick) to get the browser to do what I want.

Here we use two of the four characteristics of ANGULARJS----bidirectional data binding

Note: A line of Dom code is not written! This is the advantage of Ng, bootstrap.css in order to layout, JS code is simply to create NG module and NG Controller

Effect:

<!
DOCTYPE html>  

Ps:angularjs simple implementation of the full selection, multiple-selection operation

Many times we need to implement bulk operation data when dealing with curd (add-and-check), so we have to use multiple-selection operations.

Angular is implemented as follows (there are, of course, many better ways to write than the author, and this is just a simple implementation.) ）

Html:

<section>
<pre>{{choseArr}}</pre> Select
: <input type= "checkbox" ng-model= "Master" Ng-click= ' All (Master,tesarry) ' >
<div ng-repeat= ' z in Tesarry ' >
<input id={{z}} type= ' checkbox ' Ng-model= "x" ng-checked= "Master" ng-click= "Chk (z,x)" >{{z}}
</div>
<a href= "#" class= "btn Btn-danger "ng-click=" Delete () "> Delete </a>
</section>

The page effect is as follows: (CSS using bootstrap)

JS Code:

$scope. tesarry=[' 1 ', ' 2 ', ' 3 ', ' 4 ', ' 5 '];//initialize data
$scope. chosearr=[];//defines arrays for storing front-end display
var str= "";//
var Flag= ';//whether to click on the Select All, is a
$scope. x=false;//The default unchecked
$scope. all= function (c,v) {//Select all
if (c==true) {
$ Scope.x=true;
$scope. chosearr=v;
} else{
$scope. X=false;
$scope. chosearr=[""];
}
Flag= ' a ';
};
$scope. chk= function (z,x) {//radio or multiple-select
if (flag== ' a ') {//operate str = $scope on a select-only basis
. Chosearr.join (', ') + ', ';
}
if (x = = True) {//select
str = str + z + ', ';
} else {
str = str.replace (z + ', ', ');/
/uncheck} $scope. chosearr= (Str.substr (0,str.length-1)). Split (', ');
$scope. delete= function () {//Operation curd
if ($scope. chosearr[0]== "" | | $scope. chosearr.length==0) {////When no one is selected prompt
alert ("Please select at least one piece of data to operate!"). ") return
;
for (Var i=0;i< $scope. chosearr.length;i++) {
//alert ($scope. chosearr[i]);
Console.log ($scope. chosearr[i]);//traverse the selected ID
}
};