AngularJS checkboxes filter
ng-repeat from checkboxes
by Andrew Pougher
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/paper/bootstrap.min.css">
<h1 class="lead">Filter ng-repeat with checkboxes</h1><div ng-app="" ng-controller="LoginController">
<div ng-repeat="tc in typeCheckBoxes">
<input type="checkbox" ng-model="tc.val">{{tc.label}}
</div>
<pre class="lead">{{kw}}</pre>
<hr>
<pre class="lead"> {{kw1}}</pre>
<hr>
<div ng-repeat="p in andrew">
<span class="badge">{{p.label}}</span>
</div>
</div>
<script>
/* http://bit.ly/ARP71 */
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-4809804-1', 'auto');
ga('send', 'pageview');
</script>
JavaScript
function LoginController($scope, $filter) {
$scope.typeCheckBoxes = [{
label: "Andrew",
val: false
}, {
label: "Pougher",
val: false
}, {
label: "Katherine",
val: false
}];
$scope.$watch('typeCheckBoxes', function (newObj, oldObj) {
var checked = $filter('filter')(newObj, {'val': true});
$scope.kw = (checked);
$scope.andrew = $scope.kw; // a new list with filtered
var unchecked = $filter('filter')(newObj, {'val': false});
$scope.kw1 =(unchecked);
}, true);
}