Filtering by Multiple Specific Model Properties

Posted on   |   In ,   |  

####Objective####

  1. Example of showing to filter by Multiple Specific Model Properties by using [filter function][0]
  2. Example of [currency filter][1] <!-- more --> <iframe style="width: 100%; height: 320px" src="http://embed.plnkr.co/scuPYt" frameborder="0" allowfullscreen="allowfullscreen"></iframe>

MarkupGithub
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<div class="row">
    <input class="span4 pull-right" type="text" placeholder="Search for smartphone in model and brand" ng-model="query">
</div>
<div class="row">
    <table id="results" class="table table-striped table-bordered table-hover">
        <thead>
        <tr>
            <th>Brand</th>
            <th>Model</th>
            <th>Price</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="smartphone in smartphones | filter: search ">
            <td id="brand"></td>
            <td id="model"></td>
            <td id="price"></td>
        </tr>
        </tbody>
    </table>
</div>
AngularJSGithub
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
var app = angular.module('ngApp', []);
app.controller('MainCtrl', ['$scope', function ($scope) {
    'use strict';
    $scope.smartphones = [
        {brand: 'Apple', model: 'iPhone 4S', price: '999'},
        {brand: 'Samsung', model: 'SIII', price: '888' },
        {brand: 'LG', model: 'Optimus', price: '777'},
        {brand: 'htc', model: 'Desire', price: '666'},
        {brand: 'Nokia', model: 'N9', price: '555'}
    ];
    $scope.search = function (row) {
        return !!((row.brand.indexOf($scope.query || '') !== -1 || row.model.indexOf($scope.query || '') !== -1));
    };
}]);
[0]:http://docs.angularjs.org/api/ng.filter:filter [1]:http://docs.angularjs.org/api/ng.filter:currency