Question

我的模板一侧有一个按钮，可以切换范围布尔值。

在我的控制器中，我有一个功能＆＃34; scaleHeader（）＆＃34;在负载上以500ms的间隔触发。

如果我的布尔值设置为false，我只希望函数的间隔执行发生。

在我的控制器中，我有一个切换布尔值的值的函数（＆＃34; $ scope.block＆＃34;），我有＆＃34; scaleHeader＆＃34;函数，我在$ scope.block boolean上设置了$ watch方法。

布尔值在控制器中初始化为false，因此设置了间隔。但是当我按下按钮并将$ scope.block设置为true时，$ interval.cancel（）dosnt似乎停止调用＆＃34; scaleHeader（）＆＃34;

这是我的控制器：

app.controller('listeditorController', ['$scope', '$routeParams', '$route', '$http', '$location', '$modal', '$cacheFactory', '$interval',
  function ($scope, $routeParams, $route, $http, $location, $modal, $cacheFactory, $interval) {

        $scope.block=false;

        $scope.blockToggle = function(){
          if ($scope.block == false){
            $scope.block = true; 

          } else{
            $scope.block = false;
          }
        }

        $scope.scaleHeader = function(){
          if($scope.block == false){                          
            console.log('scaling');

            var colNumber = document.getElementsByClassName('fixedHeader')[0].getElementsByTagName('TR')[0].getElementsByTagName('TH');

            for (i = 0; i < colNumber.length; i++) { 
              var newColSize = document.getElementById(i).getBoundingClientRect().width;

              document.getElementsByClassName('fixedHeader')[0].getElementsByTagName('TR')[0].getElementsByTagName('TH')[i].style.minWidth = newColSize +"px";

              document.getElementsByClassName('fixedHeader')[0].getElementsByTagName('TR')[1].getElementsByTagName('TD')[i].style.minWidth = newColSize +"px";    
            }
          }
        }

        $scope.$watch('block', function(newValue,  oldValue) {
          console.log('block changed from '+oldValue+' to '+newValue);

          if(newValue == true){

            console.log('trying to cancell'); 
            $interval.cancel($scope.ccc);

          } else{$scope.ccc = $interval( function(){ $scope.scaleHeader(); }, 500);}
        });

}]);

Angular $ interval.cancel（）失败

0 个答案: