CODEWITHSUNDEEP
angularjs
a walter
a walter

Reputation: 59

Better Searching With Angular

I have built an angular app which searches through a load of objects.

The problem is that the search filters match any part of the string returning irrelevant searches. for example. If I search the name Steve the results will bring up both steve , eve and steven. I want the search results to return steve and steven. Plunkr: https://plnkr.co/edit/awN5ZxIpZ3fJJUkD5k6Y Code 

<input id="search-input" ng-model="searchTerm" placeholder="Search">
</div>
<ul class="search-ul">

    <li class="search-list"  ng-if="searchTerm.length > 2" ng-repeat="item in SearchItems| filter:searchTerm">
         <div class="button-wrap">
        <a href="" ng-click="openLinkSearch(item.url)"><img class="icon" src="{{item.image}}" /></a>
    </div>
       <span class="text">{{item.name}}</span>
    </li>
</ul>

Upvotes: 1

Views: 121

Answers (2)

Thanigainathan
Thanigainathan

Reputation: 1547

Please refer Angular material. https://docs.angularjs.org/api/ng/filter/filter

For strict search you have to tag the object property to search field.

For example to filter name <input ng-model="searchTerm.name"></label> <label>Equality <input type="checkbox" ng-model="strict"></label><br>

Also try setting strict

ng-repeat="item in SearchItems| filter:searchTerm:strict"

Upvotes: 0

Simon K
Simon K

Reputation: 2857

Reproducing with an object that only has a name field, I get results as expected ('steve' and 'steven' only). This suggests that it is matching on something other than the name field.

If you want your filter to ONLY use the item.name field then use the following:

<li class="search-list"  ng-if="searchTerm.length > 2" ng-repeat="item in SearchItems| filter:{name:searchTerm}">

Upvotes: 2

Related Questions