Thursday, 15 August 2013

javascript - Hiding a sub category in AngularJS with filtering -



javascript - Hiding a sub category in AngularJS with filtering -

i have list of content, has 2 levels. info sorted iterate on show it. have this

category 1 subcategory1 item1 item2 subcategory2 item3 item4 subcategory3 item5 item6 subcategory4 item7 item8 category 2 subcategory1 item9 item10 subcategory2 item11 item12

and on. have text filter, can come in text , content list filters based on both titles , tags. works fine. want do, hide subcategory 1 in category 2, if item9 , item10 excluded filter. have 2500 items , it's bit slow. instead of counting items again, want count them filtered. means when filter starts, need reset list , count items found. have 2 controllers, parent has text box in it, , kid used each item, because i've read faster using filter ( because filter removes things dom ). i'm still not sure if it's true, experimenting. in meantime, in parent controller:

$scope.dofilter = function() { (var c = 0; c < $scope.categories.length; ++c) { var categoryid = $scope.categories[c].id; (var r = 0; r < $scope.regions.length; ++r) { var regionid = $scope.regions[r].id; $scope.showregions[string(categoryid) + string(regionid)] = 0; } } $scope.$broadcast("triggerfilters", {}); }

and @ bottom of search method in kid controller:

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]++; }

remember, there's instance of kid controller, each element, it's ( cutting downwards version, readability ):

<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>

so, when set breakpoints in chrome, can see collection of item counts growing. angular inspector in chrome freezes ( perhaps because have 2500 controllers ? ) , if set break point on method called when force 'search', collections empty again. so, i've attempted add together filters, lists never show if add together ng-hide, because collection empty, although fills search occurs.

i using $parent, because each item has it's own controller , thought if modify parent item, local copy. so, visibly working, values disappearing when search ends, , don't know why.

thanks looking

ok - sorted out. angular maintains variables @ level of each scope, kid scope inherits value, if alter in kid level, parent 1 unchanged unless utilize $scope.$parent. project has evolved, i've learned more angular. didn't quite realise had 2 nested scopes @ point of info items. so, needed alter $scope.$parent, $scope.$parent.$parent, , well. need work out why it's slow.....

javascript angularjs

No comments:

Post a Comment