javascript - 如何在 AngularJS 中实现 JavaScript 闭包？

Question

我正在使用一个函数来计算按钮的点击次数，如下所示:

$scope.counterFunc = (function(){
    var count = 0;
    console.log('i will be consoled only once');
    return function(){
        console.log(count);
        return ++count;
    }
})();

查看:

<button ng-click="counterFunc()">click me</button>
<div>  
    {{ count value }}
</div>

我能够控制计数值，但如何在 View 中显示它。

我可以使用$scope变量来绑定(bind)计数值来查看，但我担心的是count不应该被任何其他改变counterFunc()

之外的函数

还有其他方法可以做到这一点吗？...

Answer 1

您的counterFunc()每次执行 ng-click 时已经返回递增的值。您可以将其分配给 View 上的变量，如下所示

<button ng-click="count = counterFunc()">click me</button>
<div>
  {{ count }}
</div>

请注意count属性将通过上述解决方案在您的 $scope 中创建但这与 count 不同counterFunc() 内的变量和改变$scope.count不会影响var count 。您可以通过添加另一个 button 来测试这一点用于重置 $scope.count 的值

<button ng-click="count = counterFunc()">click me</button>
<div>
  {{ count }}
</div>
<button ng-click="count = 0">Reset</button>

现在，每次按重置 button 时，您都会看到，显示值将变为0 。但是，当您按click me时再次，它将从 var count 的最后一个值开始.