2014-02-09 5 views
0

Я новичок в угловом и Javascript ООП в целом. Я надеюсь построить многоразовый угловой компонент, где весь элемент управления может быть привязан к экземпляру объекта javascript. Одно странное поведение, с которым я столкнулся, - это попытка фильтрации коллекции с помощью метода javascript-объекта.Могу ли я использовать метод объекта для фильтрации ng-repeat?

У меня есть объект с методом filterVisible с подписью:

this.filterVisible = function(item) 

Когда я пытаюсь использовать нг-повтор фильтрованного этого методом метода объекта:

ng-repeat="item in item1.items | filter: item1.filterVisible" 

Это не кажется для работы, но если я обмотаю этот метод объекта в методе в моей области $, например:

$scope.filterVisible1 = function(item) { 
    return ($scope.item1.filterVisible(item)); 
} 

и chan ge my repeat to:

ng-repeat="item in item1.items | filter: filterVisible1" 

Это работает.

Это немного запутанно, поэтому я положил его в plunker. Может кто-нибудь объяснить, почему фильтр с помощью метода scope работает, но фильтр с методом объекта не работает?

ответ

1

Как вы видите, в документе, http://docs.angularjs.org/api/ng.filter:filter

{{ filter_expression | filter:expression:comparator }} 

Вы можете использовать выражение с filter, и выражение для оценки всех свойств от объема делать оценку, в отличие от JavaScript, где выражения вычисляются относительно глобального окна как deccirbe в документации, http://docs.angularjs.org/guide/expression.

Таким образом, вопрос, чтобы поднять это

item1.filterVisible определен в объеме? vs. filterVisible1 определяется в области?

String "item1.filterVisible", который может быть обработан Javascript, однако это не является правильным выражением для $ scope. Метод $ eval().

Чтобы убедиться, что ваше выражение работает, запустите следующее в консоли Chrome после щелчка по элементу.

angular.element($0).scope().$eval(<your expression>) 

Кроме того, я считаю, что объект должен иметь значащее имя метода. В вашем случае filterVisible несколько сбивает с толку.

- Редактировать -
Это говорит о том, что код предоставлен как определенный в $ scope. Я обнаружил, что есть ошибка JS, эта ошибка может быть исправлена ​​этим.

var _this = this; 
    this.filterVisible = function(item) { 
    return (Math.abs(_this.items.indexOf(item) - _this.selected_id) <= _this.limit); 
    } 
+0

Я немного смущен вашим ответом. item1 определяется в $ scope, и он имеет функцию filterVisible. Вы можете увидеть это в моем плунтере здесь: http://run.plnkr.co/plunks/VuolUr/ – infomofo

+0

Мои извинения, я сделал дикое предположение о вашем коде. у вас ошибка JS. ответ редактируется. – allenhwkim

+0

ahh, good catch - я новичок в js, и это все еще меня пугает. спасибо за помощь, теперь он отлично работает! – infomofo

Смежные вопросы