Binding Multiple Values with ngModel Directive in AngularJs

If you look at the official ngModel documentation then technically we cannot pass multiple values to the ngModel (ng-model) directive. But you might get into such a requirement where the tabular data needs to be searched based on some columns (and not all).

For example,  considering below table we need search query to be filtered with last 2 columns only.

AngularJs Code

app.controller('MainCtrl', function($scope) {
    $scope.search = '';
    $scope.filterOnLocation = function(friend) {
        return (friend.city.toLowerCase() + friend.address.toLowerCase()).indexOf($scope.search) >= 0;
    };
});

HTML Binding

<!-- input field -->
<input class="form-control" ng-model="search">

<!-- filtered search -->
...
<tr ng-repeat="friend in friends | filter: filterOnLocation">
    <td>{{friend.name}}</td>
    <td>{{friend.phone}}</td>
    <td class="highlight">{{friend.city}}</td>
    <td class="highlight">{{friend.address}}</td>
</tr>

Demo

Edit in Plunker