ng-repeat with dynamic array:视图未更新

时间:2022-07-07 19:44:31

I have some checkboxes inside blocks like this :

我在块内部有一些复选框,如下所示:

<div ng-show="searchIn.IS" class="filterContent">
    <div ng-click="toggleFilter('IS')">
       <span class="{{filters.IS}}FilterIcon"></span> 
       Information System :
    </div>
    <div ng-show="filters.IS">
        <md-checkbox ng-repeat="IS in ISList" ng-click="setISSearch(IS)" ng-checked="isInISSearch(IS)">
            {IS}}
        </md-checkbox>
    </div>
</div>
<br />
<div ng-show="searchIn.area" class="filterContent">
   <div ng-click="toggleFilter('area')">
      <span class="{{filters.area}}FilterIcon"></span>
      Area :
   </div>
   <div ng-show="filters.area">
     <md-checkbox ng-repeat="area in filterAreaList" ng-click="setAreaSearch(area)" ng-checked="isInAreaSearch(area)" ng-show="isInCurrentAreas(area)">
         {{area}}
     </md-checkbox>
   </div>
</div>

So the thing is that filterAreaList is changed each time I check or uncheck a checkbox from the ISList block. But the view is not updated, all the area are still displayed. I also tried ng-if instead of ng-show.

所以问题是每次检查或取消选中ISList块中的复选框时都会更改filterAreaList。但视图未更新,所有区域仍然显示。我也试过ng-if而不是ng-show。

$scope.filterAreaList = [];

$scope.getAreaFilters = function ()  {
    $scope.searchedIS = $scope.ISList.slice();
    for (var i = $scope.searchedIS.length; i >= 0; i--) {
        if ($scope.searched.IS.indexOf($scope.searchedIS[i]) === -1)
            $scope.searchedIS.splice(i, 1);
    }
    for (var i = 0; i < $scope.areaList.length; i++) {
        for (var j = 0; j < $scope.searchedIS.length; j++)
            if ($scope.hasArea($scope.searchedIS[j], $scope.areaList[i]))
                $scope.filterAreaList.push($scope.areaList[i]);
    }
};

$scope.isInCurrentAreas = function (area) {
    if ($scope.filterAreaList.indexOf(area) === -1)
        return false;
    return true;
};

Some other topics pointed to this : http://www.bennadel.com/blog/2443-rendering-dom-elements-with-ngrepeat-in-angularjs.htm

其他一些主题指出:http://www.bennadel.com/blog/2443-rendering-dom-elements-with-ngrepeat-in-angularjs.htm

But I don't really see how to apply this to my case.

但我真的没有看到如何将这个应用到我的案例中。

1 个解决方案

#1


1  

Well, I actually missed a few things :

好吧,我实际上错过了一些事情:

In order to make it work, I added : $scope.filterAreaList = []; in my getAreaFilters() function, and I call getAreaFilters() in my setAreaSearch(area)

为了使它工作,我补充说:$ scope.filterAreaList = [];在我的getAreaFilters()函数中,我在setAreaSearch(区域)中调用getAreaFilters()

And that's it.

就是这样。

#1


1  

Well, I actually missed a few things :

好吧,我实际上错过了一些事情:

In order to make it work, I added : $scope.filterAreaList = []; in my getAreaFilters() function, and I call getAreaFilters() in my setAreaSearch(area)

为了使它工作,我补充说:$ scope.filterAreaList = [];在我的getAreaFilters()函数中,我在setAreaSearch(区域)中调用getAreaFilters()

And that's it.

就是这样。