I've got an json full of datas with lowcase and upcase. For example :

[

  { "firstName":"JoHn" , "lastName":"DoE" }, 
  { "firstName":"aNnA" , "lastName":"smIth" }, 
  { "firstName":"PeTer" , "lastName":"JOnes" }

]

And I've got something similar to this :

Search: <input ng-model="searchText">
        <table id="searchTextResults">
          <tr><th>Name</th><th>Phone</th></tr>
          <tr ng-repeat="friend in friends | filter:searchText">
            <td>{{friend.firstName}}</td>
            <td>{{friend.lastName}}</td>
          </tr>
        </table>

What I want to do is to search a friend without looking at upcases and lowcases. So basically when I type "John", "JOHN" or simply "john" in my input, it should return my friend John.

So is it possible to apply a case insensitive option to a filter ?

I've got an json full of datas with lowcase and upcase. For example :

[

  { "firstName":"JoHn" , "lastName":"DoE" }, 
  { "firstName":"aNnA" , "lastName":"smIth" }, 
  { "firstName":"PeTer" , "lastName":"JOnes" }

]

And I've got something similar to this :

Search: <input ng-model="searchText">
        <table id="searchTextResults">
          <tr><th>Name</th><th>Phone</th></tr>
          <tr ng-repeat="friend in friends | filter:searchText">
            <td>{{friend.firstName}}</td>
            <td>{{friend.lastName}}</td>
          </tr>
        </table>

What I want to do is to search a friend without looking at upcases and lowcases. So basically when I type "John", "JOHN" or simply "john" in my input, it should return my friend John.

So is it possible to apply a case insensitive option to a filter ?

• javascript
• json
• angularjs
• filter
• angularjs-filter

2 Answers 2

There is a way to turn on case insensetive filter:

<div data-ng-repeat="item in items | filter : searchText : false"></div>

Plunker

Pass a function name to filter which you define on an applicable scope, where you use string's toLowerCase. See ngFilter. The function signature is a simple function (item) { ... }.

Example JS in your controller:

$scope.filterOnlyFoo = function (item) {
    return item == "foo";
}

Example HTML:

<div data-ng-repeat="item in items | filter: filterOnlyFoo"></div>

Sample Plunker