Question

我正在刷新使用$interval检查数据的方法。我正在使用拨动开关来打开/关闭。默认情况下，它以ON开头并刷新。如果我将其关闭则进入OFF状态，5秒后再次进入ON状态并继续刷新。为什么我的cancel()没有被调用？

HTML

<div>
    <i class="fa fa-toggle-on active" ng-if="status == true" ng-click="changeStatus();"> </i>
    <i class="fa fa-toggle-on fa-rotate-180 inactive" ng-if="status ==false" ng-click="changeStatus();"> </i>
</div>

JS

App.controller('Ctrl', [ '$scope', 'Details', '$interval', function($scope, Details, $interval  ) {

    $scope.availableDetailsTemp = [];
    $scope.availableDetails = [];

    init();  

    function init() {
        $scope.status = true;
        $scope.availableDetails = [];
        $scope.availableDetailsTemp = 
        Details.resource2.query(function(response) {
            angular.forEach(response, function(item) {
                if (item) {
                    $scope.availableDetails.push(item);
                }
            });
        });
     }
     var myInterval = null;

     if ($scope.status = true) {
        myInterval = $interval(init, 5000);
     }          

     $scope.changeStatus = function(){
         $scope.status = !$scope.status;
         if ($scope.status = false) {
             $interval.cancel(myInterval);
         }  
     };
}]);

Answer 1

当您打算使用assignment operator时，您似乎使用了comparison operator。在JavaScript中，有三个看似相似的运算符很容易混淆：=，==和===。

以下是MDN对赋值运算符=所说的内容：

简单赋值运算符，它为变量赋值。赋值操作将计算为指定的值。

因此，if (x = false)形式的声明就是这样做的：

首先，x = false 将值false分配给变量x 。现在x包含值false。
分配的结果是指定的值：false。这将作为if传递到if (false)语句中。因此，if声明无法通过。

这是一个显示赋值运算符的示例：

＆＃13;

var x;

if (x = true) {
  console.log('x = true passed! x is now ' + x);
}

if (x = 'banana') {
  console.log('x = banana passed! x is now ' + x);
}

if (x = false) {
  //You'll never get here!
}
else {
  console.log('x = false failed! x is now ' + x);
}

＆＃13;

通常我们只关心变量是否为truthy or falsy value。在这些情况下，我们可以完全省略比较运算符，并直接在if条件下评估变量。

因此，在您的情况下，我们可以将条件更改为：

if ($scope.status) {
  //$scope.status is truthy
  myInterval = $interval(init, 5000);
}           

$scope.changeStatus = function(){
    $scope.status = !$scope.status;
    if (!$scope.status) {
      //$scope.status is falsy
      $interval.cancel(myInterval);
    }   
}

Angularjs自动刷新不会在取消时停止

1 个答案: