Question

我正在更新按钮单击的$ scope，它基本上进行Restangular调用，获取数据并填充$ scope变量。

但是，如果用户在$ digest循环运行时多次单击该按钮，$ scope将更新为重复值。

我很确定这是一个常见的问题。但是，我还没有找到一个关于SO的解决方案。

人们建议使用$timeout但似乎是反逻辑的。

我宁愿在$digest周期运行时禁用该按钮。

这是我到目前为止所实施的内容。

$scope.names = [];
$scope.disableButton = true;
FetchNames.getAllNames().then(function(result){
  result.data.forEach(function(name){
    $scope.names.push(name);
  });
$scope.disableButton = false;
});

此处，在承诺得到解决时，该按钮被禁用。但这并不能解决我的问题。我需要检查摘要周期何时完成。

Answer 1

试试这个：

$scope.names = [];
$scope.disableButton = true;
FetchNames.getAllNames().then(function(result){
  // if in digest; reuturn
  if($scope.$$phase || $scope.$root.$$phase ){return}
  result.data.forEach(function(name){
    $scope.names.push(name);
  });
$scope.disableButton = false;
});

Answer 2

我认为这会对你有所帮助

Angular JS identify an digest complete event and removing # from url in angular js during viewchange

和link

Answer 3

使用ng-disabled内置指令在用户单击时禁用按钮。实现这一点只需将变量设置为true即可。请看下面的代码

<button ng-click="btn1=true, yourFunction()" ng-disabled='btn1'>

在你的控制器中可以像这样

    $scope.btn1= false;
    $scope.yourFunction= function(){
      $scope.names = [];
      FetchNames.getAllNames().then(function(result){
        result.data.forEach(function(name){
          $scope.names.push(name);
       });
       $scope.disableButton = false;
     };

在消化周期以角度运行时，防止按钮单击

3 个答案: