AngularJS - Checkbox cheked with ng-click after i checked with select all it check all but Clearing all is not clears all
I have a list of objects in and Json array. I have declared the checkboxes with ng-repeat but when i check one and more checkboxes one by one it selects the checkbox and after that if i choose the part to select all for check all checkboxes with select all button it selects all also. But after i want to unselect all the array has no objects its true. But visualisation of checkbox is still checked why? Can anyone help me on this?
Here is the part of my coding about checkboxes
var app = angular.module('myApp', []);
app.controller('companyCtrl', ['$scope',
function($scope) {
$scope.addCompany = function(cmpid) {
$scope.form.companies.push(cmpid);
};
$scope.Companies = [{
"id": "001",
"name": "Company1",
"address": "Bla bla street, Somewhere City, Some Country"
}, {
"id": "002",
"name": "Company2",
"address": "Bla bla street, Somewhere City, Some Country"
}, {
"id": "003",
"name": "Company3",
"address": "Bla bla street, Somewhere City, Some Country"
}, {
"id": "004",
"name": "Company4",
"address": "Bla bla street, Somewhere City, Some Country"
}, {
"id": "005",
"name": "Company5",
"address": "Bla bla street, Somewhere City, Some Country"
}, {
"id": "006",
"name": "Company6",
"address": "Bla bla street, Somewhere City, Some Country"
}];
$scope.checkAll = function() {
$scope.form.companies.splice(0, $scope.form.companies.length);
$scope.all = true;
for (var i in $scope.Companies) {
$scope.addCompany($scope.Companies[i].id);
}
console.log($scope.form.companies);
};
$scope.uncheckAll = function() {
$scope.form.companies.splice(0, $scope.form.companies.length);
$scope.all = false;
for (var i in $scope.Companies) {
$scope.addCompany('');
}
console.log($scope.form.companies);
};
)
]
};
<html>
<head>
<script src="http://ift.tt/1oMJErh"></script>
<script src="http://ift.tt/1mQ03rn"></script>
</head>
<body ng-app="myApp">
<div>
<a href="#" ng-click="checkAll()">Select All</a>
<a href="#" ng-click="uncheckAll()">Clear All</a>
</div>
<ul>
<li ng-repeat="cmp in Companies">
<div ng-if="cmp">
<input id="company-" type="checkbox" ng-model="cmp.Selected" ng-click="addCompany(cmp.id)" ng-value="cmp.id" ng-checked="all || cmp.Selected" />
<label for="company-">
<div class="title"></div>
</label>
</div>
</li>
</ul>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire