$ scope.watch被调用的次数太多

Question

我以为我已经解决了这个问题，但事实证明，我没有提供任何帮助将不胜感激。

基本上，我遇到了导致我的$ scope的控制器和范围问题，$ watch（）会在我不需要时调用。

我有一个角度视图（html）的下拉和分页标记使用不同的控制器和视图。

首先，我有这样的：（其中form_item_Division.html仅仅是部门的下拉列表）

<div class="panel panel-primary panel-shad-1" ng-controller="DashboardIEPItemDraftCtrl"> 
     <div ng-include="'views/partials/form_item_Division.html'"></div> 
     <div ng-include="'app/dashboard/iep.html'" ng-controller="DashboardIEPItemDraftCtrl"></div> 
</div> 

我iep.html看起来是这样的：

<div ng-controller="DashboardIEPItemDraftCtrl"> 
<div ng-include="'app/dashboard/iepitem_table1.html'" ng-if="numberOfItemsByUserDivision > 0"></div> 

     <div class="col-xs-12 text-center" ng-show="totalNumberPages > 1"> 
      <pagination items-per-page="itemsPerPage" 
        total-items="numberOfItemsByUserDivision" 
        ng-model="currentPage" 
        max-size="3" 
        boundary-links="true" 
        rotate="false" 
        class="pagination-sm panel-shad-1" 
        num-pages="totalNumberPages" 
        previous-text="&lsaquo;" 
        next-text="&rsaquo;" 
        first-text="&laquo;" 
        last-text="&raquo;"> 
      </pagination> 
     </div> 
</div> 

我iepitem_table1.html定义表格布局，并在不同的控制器下。它看起来像这样：

<table class="table table-condensed table-striped table-hover" ng-controller="IEPItemTableCtrl"> 

    (table layout defined here) 

</table> 

我的剧本的相关部分如下所示：

$scope.getItemsBySelectedDivision = function (selectedDivisionId) { 
    blah.get({ count: true, filter: 'DivisionPerformingId eq ' + 
    selectedDivisionId }).$promise.then(
     function (response) { 
     $scope.itemsByUserDivision.length = 0; 
     $scope.itemsByUserDivision = response.value; 
     $scope.numberOfItemsByUserDivision = response.value.length; 
     $scope.totalNumberPages = Math.ceil(response.value.length/ 
     $scope.itemsPerPage); 
     var pagedData = $scope.itemsByUserDivision.slice(0, 
     $scope.itemsPerPage); 
     $scope.itemsByUserDivision = pagedData; 
     }, 
     function (error) { 
      // Do something when it errors 
     }); 
     }; 

$scope.$watch("currentPage", function() { 
    if ($scope.itemsByUserDivision != null) { 
    $scope.itemsByUserDivision = originalItems; 
    var pagedData = $scope.itemsByUserDivision.slice(($scope.currentPage - 
    1) * $scope.itemsPerPage, $scope.currentPage * $scope.itemsPerPage); 
    $scope.itemsByUserDivision = pagedData; 
} 
}); 

当我从下拉列表中选择一个部门，通过与分页标签一切正常滚动页面。但是，当我滚动页数超过一页的分部页面，然后返回并选择另一个分区时，显示的结果不正确。我认为这是因为我的$ scope。$ watch（）在我不想要的时候被调用。我想我没有为这种情况正确安排我的控制器。无论如何，任何帮助都非常感谢。

感谢，

皮特

Answer 1

您可以比较在变量的变化你看，

$scope.$watch("currentPage", function (oldVal,newVal) { 
     if(newVal!==oldVal){ 
       if ($scope.itemsByUserDivision != null) { 
       $scope.itemsByUserDivision = originalItems; 
       var pagedData =$scope.itemsByUserDivision.slice(($scope.currentPage - 
     1) * $scope.itemsPerPage, $scope.currentPage * $scope.itemsPerPage); 
     $scope.itemsByUserDivision = pagedData; 
    } 
    } 
    });