Вопрос по regex, javascript, angularjs, frameworks – Как использовать Regex с ng-repeat в AngularJs?

18

Я хочу использовать регулярное выражение в нг-повтор. Я пробовал следующий код, но он не работает.

<div ng-repeat="user in users | filter:{'type':/^c5$/}"></div>

У меня есть массив users, и я хочу отображать только пользователей с типом c5.

Если я использую

filter:{'type':'c5'} 

затем отображаются пользователи с типом «ac5x»; тоже, потому что содержит с5.

Как я могу решить эту проблему? Может быть, есть другое решение.

Благодарю вас!

Я не знаком с AngularJs, ноin here it states что выражение фильтра может принимать функцию. inhan

Ваш Ответ

5   ответов
0

но предыдущие решения не работают для общего случая, например, для случая объекта, где многоуровневые поля.

Например:

<div ng-repeat="item in workers | regex:'meta.fullname.name':'^[r|R]' ">

Мое решение:

.filter('regex', function() {
  return function(input, field, regex) {
    var f, fields, i, j, out, patt;
    if (input != null) {
      patt = new RegExp(regex);
      i = 0;
      out = [];
      while (i < input.length) {
        fields = field.split('.').reverse();
        j = input[i];
        while (fields.length > 0) {
          f = fields.pop();
          j = j[f];
        }
        if (patt.test(j)) {
          out.push(input[i]);
        }
        i++;
      }
      return out;
    }
  };
});

Он работает для многоуровневых объектов или простых объектов с одним уровнем атрибутов.

Поздно, но надеюсь, что это поможет вам увидеть под другим углом.

Это код в CoffeeScript, чище:

angular.module('yourApp')
    .filter 'regex', ->
        (input, field, regex) ->
            if input?
                patt = new RegExp(regex)
                i = 0
                out = []
                while i < input.length
                    fields = field.split('.').reverse()
                    j = input[i]
                    while fields.length > 0
                        f = fields.pop()
                        j = j[f]
                    if patt.test(j)
                        out.push input[i]
                    i++
                return out
36

Если вы захотите чаще фильтровать по регулярным выражениям, вы можете создать собственный фильтр. Что-то вродеэта скрипка позволит вам указать поле для проверки на регулярное выражение:

var myApp = angular.module('myApp', []);
myApp.filter('regex', function() {
  return function(input, field, regex) {
      var patt = new RegExp(regex);      
      var out = [];
      for (var i = 0; i < input.length; i++){
          if(patt.test(input[i][field]))
              out.push(input[i]);
      }      
    return out;
  };
});

Используется как это где'type' указывает поле, с которым вы проверяете (в данном случае поле с именем type):

<div ng-repeat="user in users | regex:'type':'^c5$'"></div>
+1 за создание фильтра кустума. Отличная идея! Спасибо! Vural Acar
1

ы совпадений, включая точное совпадение.

Однако, учитывая, что пример, приведенный в теле этого вопроса - выражение^c5$ - это просто точное совпадение, вы можете указать, что угловой фильтр должен выполнятьexact match.

Это решит проблему, с которой вы столкнулись при сопоставлении "ac5x". также.

Уточнитьtrue в 3-м аргументе фильтра в качестве ярлыка дляexact match функция компаратора.

Как это:filter:{type:'c5'}:true

16

Таким образом, в принципе, вы можете сделать любую фильтрацию, возможную с помощью JavaScript.

<li ng-repeat="name in names | filter:myFilter"> {{ name }}

В контроллере:

$scope.myFilter = function(user) {
   return /^c5$/.test(user.type);
};
1

но я получил ошибку,

'input' is undefined

Это произошло потому, что я иногда ничего не делал. Я исправил это, добавив условное выражение для возврата пустого массива out, если вход был неопределен.

var myApp = angular.module('myApp', []);
myApp.filter('regex', function() {
  return function(input, field, regex) {
      var patt = new RegExp(regex);      
      var out = [];

      if(input === undefined) {
          return out;
      }

      for (var i = 0; i < input.length; i++){
          if(patt.test(input[i][field]))
              out.push(input[i]);
      }      
    return out;
  };
});

Надеюсь, это поможет кому-то, кто может иметь ту же проблему

Похожие вопросы