jhamm jhamm - 5 months ago 22
AngularJS Question

Why is my angular filter not filtering all appropriate objects? Angular - angular-ui-bootstrap

I have a

filter
in my
uib-typeahead
The
ng-options
portion looks like this

<input
ng-model="mergeParticipant"
getDisplayValue(value.name, value.age, value.membershipId) for value in participants | filter:$viewValue"
/>


The function that is being called to format the display is here:

$scope.getDisplayValue = (name, age, membershipId) => {
return age ? `${name} (${age}) - ${membershipId}`: `${name} - ${membershipId}`;
};


When I type in the letters
bi
into my input, here is my result:

enter image description here

Why is the entry without
bi
showing up in my list? I thought it might have something to do with the numbers on the screen, but I couldn't find any pattern there. Any ideas?

Answer

Consider your list is something like this:

$scope.list = [
    {id:1, title: 'a'},
    {id:2, title: 'b'},
    {id:3, title: 'c'},
]

You can choose which key you want to apply your filter like this:

<input type="text" ng-model="searchKey" />

<ul>
   <li ng-repeat="item in list | filter:{title: searchKey}"></li>
</ul>