Select All, cancel all, and select one.
<! -- Html -->
<Table class = "table1">
<Thead>
<Tr>
<Th> <input id = "flag" type = "checkbox" ng-model = "select_all" ng-change = "selectAll ()"> </th>
<Th> Contract No. </th>
<Th> contract name </th>
<Th> company allocation </th>
<Th> Update time </th>
</Tr>
</Thead>
<Tbody>
<Tr ng-repeat = "list in lists">
<Td> <input type = "checkbox" ng-model = "list. checked" ng-change = "selectOne ()"> </td>
<Td >{{ list. contractnum }}</td>
<Td >{{ list. template. name }}</td>
<Td >{{ list. office. name }}</td>
<Td >{{ list. updateDate }}</td>
</Tr>
</Tbody>
</Table>
<! -- Js -->
$ Scope. checked = []; // used to store the id of the selected item
$ Scope. select_all = "";
$ Scope. list = {
Checked: ""
}
// Select all
$ Scope. selectAll = function (){
If ($ scope. select_all ){
$ Scope. checked = [];
Angular. forEach ($ scope. lists, function (I ){
I. checked = true;
$ Scope. checked. push (I. id );
})
} Else {
Angular. forEach ($ scope. lists, function (I ){
I. checked = false;
$ Scope. checked = [];
})
}
};
// Single answer
$ Scope. selectOne = function (){
Angular. forEach ($ scope. lists, function (I ){
Var index = $ scope. checked. indexOf (I. id );
If (I. checked & index =-1 ){
$ Scope. checked. push (I. id );
} Else if (! I. checked & index! =-1 ){
$ Scope. checked. splice (index, 1 );
};
})
If ($ scope. lists. length ===$ scope. checked. length ){
$ Scope. select_all = true;
} Else {
$ Scope. select_all = false;
}
}