AngularJs, нечувствительный к регистру фильтр

У меня есть json, полный данных с строчными и верхними регистрами. Например :

[

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

]

А у меня что-то похожее на это:

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>

Что я хочу сделать, так это найти друга, не глядя на прописные и строчные буквы. Таким образом, когда я набираю «Джон», «ДЖОН» или просто «Джон» в своем вводе, он должен возвращать моего друга Джона.

Итак, можно ли применить к фильтру параметр, нечувствительный к регистру?


person user2462805    schedule 06.08.2013    source источник


Ответы (2)


Передайте имя функции в filter, которое вы определяете в применимой области, где вы используете строку в нижний регистр. См. раздел ngFilter. Сигнатура функции — простая function (item) { ... }.

Пример JS в вашем контроллере:

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

Пример HTML:

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

Образец плунжера

person Steve Klösters    schedule 06.08.2013
comment
Но я не хочу ничего занижать или повышать. Просто хочу знать, возможен ли регистр без учета регистра. - person user2462805; 06.08.2013
comment
Вам не нужно устанавливать исходное значение в нижний регистр, только временное значение (например, в выражении), чтобы выполнить проверку. Например, item.toLowerCase() == "foo" верно для FOO, но не изменяет item. - person Steve Klösters; 06.08.2013
comment
И что мне тогда делать с ng-моделью на моем входе? - person user2462805; 06.08.2013
comment
Вместо "foo" в моем примере можно что-то сделать с $scope.searchText. - person Steve Klösters; 06.08.2013
comment
Извините, я немного заблудился (и новичок в Angular! ^^) Не могли бы вы отредактировать свой ответ тем, что я написал в своем вопросе, пожалуйста? Было бы здорово - person user2462805; 06.08.2013
comment
Я добавил образец Plunker. Надеюсь, поможет! - person Steve Klösters; 06.08.2013
comment
Ваше решение отличное, но оно не строго нечувствительно к регистру, потому что, если пользователь введет верхний регистр в своем поиске, он ничего не покажет. - person user2462805; 06.08.2013
comment
Ты прав! В обоих предикатах должно быть $scope.searchText.toLowerCase() вместо $scope.searchText! - person Steve Klösters; 07.08.2013
comment
Да, правильно, теперь он работает идеально, как я и хотел. Еще раз спасибо за ваше время. - person user2462805; 07.08.2013

Есть способ включить фильтр без учета регистра:

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

Планкер

person Alexander Vasilyev    schedule 06.10.2015
comment
Я думаю, что это должно быть правильно, так как в docs.angularjs.org/api/ng /filter/filter, там сказано, что в {{ filter_expression | filter : expression : comparator}}, если comparator = false, то false|undefined: A short hand for a function which will look for a substring match in case insensitive way. - person Disp Hay; 05.12.2015
comment
@ Александр Васильев: это не на 100% правильно, поскольку он пытается сопоставить подстроку без учета регистра, поэтому, например, в его случае, если пользователь выполняет поиск по алфавиту «n», он вернет все записи, поскольку все они имеют ' n ', последний атрибут предназначен для строгой математики, если true, это будет точное совпадение, если false, это будет совпадение подстроки без учета регистра. - person Sohail Faruqui; 06.10.2016