javascript - Angularjs 不更新 Angular 模板给出的标签

Question

我有一个元素，其标题/标签使用 angularjs

 <a ng-click="addCounter()" class="btn btn-sm btn-default">{{(($scope.addingCounter)?'Save':'Add')}}</a>

刷新页面时，按钮会根据addingCounter 变量保存或添加标题。单击按钮时，addCounter 函数会更改addingCounter 变量。但按钮标签没有改变。

这是 Controller 中的方法

 $scope.addingCounter = false;
 $scope.addCounter = function () {
        $scope.addingCounter = !$scope.addingCounter;
 };

为什么？

Answer 1

从模板中删除$scope:

{{addingCounter?'Save':'Add'}}

您引用了 Controller 的$scope对象的$scope.addingCounter(例如$scope.$scope.addingCounter)。 AngularJS 无法找到这样的对象，默认情况下它会放置 falsy 值。这就是您看到添加的原因。