#javascript #angularjs
#javascript #angularjs
Вопрос:
У меня есть список контента, он состоит из двух уровней. Мои данные отсортированы, поэтому я просто перебираю их, чтобы показать. Итак, у меня есть это
Category 1
Subcategory1
Item1
Item2
Subcategory2
Item3
Item4
Subcategory3
Item5
Item6
Subcategory4
Item7
Item8
Category 2
Subcategory1
Item9
Item10
Subcategory2
Item11
Item12
и так далее. У меня также есть текстовый фильтр, так что вы можете вводить текстовые и мои фильтры списка содержимого на основе заголовков и тегов. Все это работает нормально. Что я хочу сделать, так это скрыть подкатегорию 1 в категории 2, если Item9 и Item10 исключены фильтром. У меня есть 2500 предметов, и это уже немного медленно. Вместо того чтобы снова подсчитывать элементы, я хочу подсчитывать их по мере их фильтрации. Это означает, что при запуске фильтра мне нужно сбросить свой список, а затем считать по мере нахождения элементов. У меня есть два контроллера, родительский содержит текстовое поле, а дочерний используется для каждого элемента, потому что я читал, что это быстрее, чем использование фильтра (потому что фильтр удаляет объекты из DOM ). Я все еще не уверен, правда ли это, я экспериментирую. В то же время, это находится в родительском контроллере:
$scope.doFilter = function()
{
for (var c = 0; c < $scope.categories.length; c)
{
var categoryId = $scope.categories[c].Id;
for (var r = 0; r < $scope.regions.length; r)
{
var regionId = $scope.regions[r].Id;
$scope.showRegions[String(categoryId) String(regionId)] = 0;
}
}
$scope.$broadcast("triggerFilters", {});
}
и тогда это находится в нижней части моего метода поиска в дочернем контроллере:
if (!excluded)
{
var key = String($scope.item.CategoryId) String($scope.region.Id);
if ($scope.$parent.showRegions[key] == null)
$scope.$parent.showRegions[key] = 0;
$scope.$parent.showRegions[key] ;
}
Помните, что есть экземпляр этого дочернего контроллера, для каждого элемента, это примерно так ( это сокращенная версия для удобства чтения):
<div data-ng-repeat="category in fullList">
<a>{{category.Name}}</a>
<div >
<div data-ng-repeat="region in regions | orderBy: 'Name'">
{{region.Name}}
<div >
<ul>
<li ng-controller="filterController" ng-hide="isExcludedByFilter"
data-ng-repeat="item in category.regions[region.Name].items | orderBy: 'Name'">
{{item.Name}}
</li>
</ul>
</div>
</div>
</div>
</div>
Итак, когда я устанавливаю точки останова в Chrome, я вижу, что количество элементов в моей коллекции растет. Но инспектор Angular в Chrome зависает (возможно, потому, что у меня 2500 контроллеров? ) и если я установлю точку останова для метода, вызываемого при нажатии кнопки «поиск», все коллекции снова будут пустыми. Итак, я попытался добавить фильтры, но списки никогда не отображаются, если я добавляю ng-hide, потому что коллекция всегда пуста, хотя она заполняется по мере выполнения поиска.
Я использую $parent , потому что у каждого элемента есть свой собственный контроллер, и я подумал, что если вы измените родительский элемент, вы получите локальную копию. Итак, это явно работает, но значения исчезают, когда поиск заканчивается, и я не знаю почему.
Спасибо, что посмотрели
Комментарии:
1. Что, если бы я должен был создать службу, которая хранит эти данные, и внедрить ее в оба контроллера, поможет ли это мне?
Ответ №1:
Хорошо, я с этим разобрался. Angular поддерживает переменные на уровне каждой области, поэтому дочерняя область наследует значение, но если вы измените его на дочернем уровне, родительская категория останется неизменной, если вы не используете $scope.$parent . Мой проект развивался по мере того, как я все больше узнавал об Angular. Я не совсем понимал, что у меня есть две вложенные области в точке расположения моих элементов данных. Итак, мне нужно было изменить $scope.$parent на $scope.$parent. $parent, и все было хорошо. Теперь мне просто нужно разобраться, почему это происходит так медленно…..