Слишком много итераций в фильтре

#angularjs #angularjs-ng-repeat

Вопрос:

Я создаю фильтр, чтобы получить имя здания по идентификатору:

 app.filter('getBuilding', function( APIService ) {

    return function(input) {

        var buildings = APIService.query({ route:'building', id: input }, function(building) {

            return building.name;

        });

    };

});

Пример выдает ошибку итерации. Это проблема обновления с повторным обновлением? Как я могу это предотвратить?

 <li ng-repeat="room in rooms" class="list-group-item">
   <strong>{{room.name}}</strong><span class="small">( {{room.building | getBuilding}} )</span>
</li>

Спасибо!

1. Если вы не покажете нам контроллер, к которому вы привязываете свой rooms массив, мы не сможем вам помочь. Кроме того, если бы вы могли предоставить работающий плунжер, это было бы здорово.

Ответ №1:

Фильтры следует использовать для форматирования данных для отображения. Ожидается, что вы вернете примитив (строку или число) из функции filter для отображения этого значения.

В вашем коде есть несколько проблем:

Ваша функция фильтра ничего не возвращает. Поскольку фильтр не возвращает никакого значения, AngularJS продолжает итерацию в ожидании значения. После достижения предела итерации выдается ошибка.
Ваш сервис использует обратные вызовы. Теоретически единственным способом для этого было бы вернуть объект promise из APIService . Но, насколько я знаю, фильтры не работают асинхронно и не разрешают обещания. Вы должны сразу вернуть значение, чтобы фильтр работал правильно.
Функция фильтра может вызываться много раз, пока модель не стабилизируется при изменениях области видимости. Это означает, что использование удаленных вызовов в filter может иметь серьезные проблемы с производительностью.

Правильным способом было бы загрузить имя здания в контроллер или директиву, а затем передать это значение в filter, если имя должно быть отформатировано каким-либо образом.