Вашият ng-if
ще се извиква при всеки цикъл на дайджест. Проблемът е, че съдържа израз, включващ извикване на функция. Angular няма начин да знае кога резултатът от израза може да се промени, така че го извиква всеки път.
По-добър вариант би бил да зададете флаг във всеки от каналите и да използвате ng-if, за да тествате само съответния флаг. Тогава просто трябва да актуализирате флаговете всеки път, когато $scope.activeCategory
промени, които можете да направите или с код, където задавате категорията, или с помощта на $scope.$watch()
за да го задейства автоматично.
напр.
$scope.setCategory = function (name) {
$scope.activeCategory = name;
for (var index=0; index < $scope.channels.length; index++) {
$scope.channels[index].hasCategory = hasCategory($scope.channels[index].category, name);
}
};
function hasCategory(categoryNameArray, name) {
console.log('thisisbeingcalled');
var e = _.indexOf(categoryNameArray, name);
if (e === -1) {
return false;
} else {
return true;
}
}
След това във вашия шаблон:
<md-card flex="15" flex-xs="40" class="slide-up" layout="column"
ng-repeat="channel in channels | orderBy: 'number' | filter: queryname"
ng-if="channel.hasCategory"
ng-init="channel.edit = false">
<md-card-header ng-show="channel.edit == false">
<img ng-src="{{channel.logo}}" alt="">
</md-card-header>
<md-card-header-text ng-show="channel.edit == false">
<span class="md-subhead dark-blue" layout="row" layout-align="center" layout-margin>{{channel.number}}</span>
</md-card-header-text>
</md-card>
трябва да бъде по-ефективен.