AngularJS Unique & Filter usage
http://angularjs.org/
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.js"></script>
<div ng-controller="MyCtrl">
<label ng-repeat="colour in colours | unique:'name'">
<input type="checkbox" ng-model="colour.active" />{{colour.name}}
</label>
<h3>Full List:</h3>
<div ng-repeat="colour in colours">{{colour}}</div>
<h3>Active List:</h3>
<div ng-repeat="colour in colours | filter: { active: 'true' }">{{colour}}</div>
</div>
JavaScript
var myApp = angular.module('myApp', ['ui.directives','ui.filters']);
function MyCtrl($scope) {
$scope.colours = [
{id:'1', name: 'red', active: true },
{id:'2', name: 'blue', active: false },
{id:'3', name: 'green', active: true }, {id:'1', name: 'red', active: true },
{id:'2', name: 'blue', active: false },
{id:'9', name: 'fze', active: true }, {id:'1', name: 'd', active: true },
{id:'10', name: 'blue', active: false },
{id:'3', name: 'green', active: true }, {id:'1', name: 'red', active: true },
{id:'2', name: 'blue', active: false },
{id:'94', name: 'green', active: true }, {id:'1', name: 'red', active: true },
{id:'2', name: 'blue', active: false },
{id:'3', name: 'green', active: true }, {id:'1', name: 'red', active: true },
{id:'2', name: 'blue', active: false },
{id:'3', name: 'green', active: true },
{id:'4', name: 'red', active: false }
];
}