Angular count
Count fileterd items in AngularJS
by jamey777
HTML
<script src="http://code.angularjs.org/angular-1.0.0rc9.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-controller="PhoneListCtrl">
Filter list: <input ng-model="query">
<ul>
<li ng-repeat="phone in filteredPhones">
<div data-desc="{{phone.desc}}">
{{phone.name}} : {{phone.price}}
</div>
</li>
</ul>
<p>Phones:<br>
Total: {{phones.length}}<br>
Displayed (filtered): {{filteredPhones.length}}</p>
</div>
CSS
body { padding: 10px; }
JavaScript
function PhoneListCtrl($scope, $filter) {
$scope.phones = [
{
name: "Motorola XOOM",
price: 30, desc: "jamey"},
{
name: "Dell Streak 7",
price: 40},
{
name: "Samsung Gem",
price: 55},
{
name: "Nexus S",
price: 10},
{
name: "LG Axis",
price: 30},
{
name: "Motorola Droid",
price: 90},
{
name: "Dell Next",
price: 20}
];
$scope.query = '';
$scope.filteredPhones = [];
$scope.$watch('query', function(newVal, oldVal) {
$scope.filteredPhones = $filter('filter')($scope.phones, $scope.query);
});
}