Better Searching With Angular

Question

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>

https://plnkr.co/edit/awN5ZxIpZ3fJJUkD5k6Y If you search eve steve is still there and if you search bus they both display. — a walter, Mar 10 '16 at 04:43
Here you go. https://plnkr.co/edit/bvon6vGuRdZgs3fAAy22?p=info — Satej S, Mar 10 '16 at 05:17
Possible duplicate of [exact filter in angular](http://stackoverflow.com/questions/18242520/exact-filter-in-angular) — Satej S, Mar 10 '16 at 05:17
I know that angular's defaults behavior is to return steve. I dont want that thought. I dont want it to find matches within the words them selfs — a walter, Mar 10 '16 at 06:44

Simon K · Answer 1 · 2016-03-10T03:53:35.497

2

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}">

edited Mar 10 '16 at 03:53

answered Mar 10 '16 at 03:43

Simon K

2,762
1
11
20

This would be nice. But it does not work. Is this for angularJS 1 or 2 – a walter Mar 10 '16 at 04:20
AngularJS 1, testing it on 1.5 specifically but it has worked that way for quite a few versions. – Simon K Mar 10 '16 at 04:22
could you make a plunkr so I can see it in action? – a walter Mar 10 '16 at 04:51

Thanigainathan · Answer 2 · 2016-03-10T05:15:13.447

0

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"

edited Mar 10 '16 at 05:15

answered Mar 10 '16 at 04:08

Thanigainathan

1,505
14
25

Doesn't the strict search require you to use the full word? I want people to be able to start searching and the relevant info to display. But I want the filter to not pickup matches that appear within words. For example if you search eve you will see steve, because steve ends in eve. – a walter Mar 10 '16 at 04:47
Thanks walter .I tried adding "evening" to the plunker example and searched for Steve, but it didn't retrieved evening as you mentioned in question. Are you sure your question is correct ? – Thanigainathan Mar 10 '16 at 05:19

Better Searching With Angular

2 Answers2