YepMe YepMe - 4 months ago 15
AngularJS Question

In angularjs's ng-model how parameters are added?

I am learning Angular.js , and I understand with ng-model we attach the value (that we get from any input) to the controller's

$scope
object. But recently I am going through it's filters and I do not understand the example given in the angularjs's official site filters in angular js ,What I don't understand is

<label>Any: <input ng-model="search.$"></label><br>
<label>Name only <input ng-model="search.name"></label><br>
<label>Phone only <input ng-model="search.phone"></label><br>
<label>Equality <input type="checkbox" ng-model="strict"></label><br>
<table id="searchObjResults">
<tr>
<th>Name</th>
<th>Phone</th>
</tr>
<tr ng-repeat="friendObj in friends | filter:search:strict">
<td>{{friendObj.name}}</td>
<td>{{friendObj.phone}}</td>


in the above code how do we add the parameters to the ng-model and how are they being accessed ? because the ng-init has "friends" , how theses two are being related to perform the filter or search ?

I am just trying to understand how providing search.name or search.phone we are able to access friends.name and friends.phone respectively

Answer

friends is object array. Each sub object of friends has name and phone properties. This object array is filled by ng-init as you said.

Also you have search object (model) in your scope. It has name and phone properties, too.

friendObj in friends | filter:search:strict is the standard usage for filter directive. It means that; filter "friends" using "search".

When you filter friends (object array) using search object AngularJS basically iterates over friends and collects records which returns true for both friendObj.name == search.name and friendObj.phone == search.phone (In strict mode). If you set last (strict) parameter to false, it checks for substrings.