Question

我有简单的控制器代码：

JS

$scope.showErrorAlert = false;


$scope.switchBool = function(value) {
    value = !value;
};

HTML

<div class="alert alert-error" ng-show="showErrorAlert">
                <button type="button" class="close" data-ng-click="switchBool(showErrorAlert)" >×</button>
              <strong>Error!</strong> {{errorTextAlert}}
             </div>

从代码段中，您可以看到我尝试更改$scope.showErrorAlert值。

但是它不起作用，value会更改，但不会showErrorAlert。

有人可以告诉我为什么以及如何让它发挥作用吗？

谢谢

Answer 1

JS按值传递参数。通过引用传递的简单替代是传递对象（而不是属性本身）。

即

$scope.showErrorAlert = { value: false };

$scope.switchBool = function(obj) {
    obj.value = !obj.value;
};

或者您可以重构switchBool代码以对$ scope本身进行操作。你需要硬编码或抽象“showErrorAlert”然后，很难。取决于您的要求。

Answer 2

其他人已经为你提供了一个正确的答案，说明为什么传递的变量没有在范围上改变。但是，如果你真正的用例只是为了切换布尔值而不是至少有两种更简单的方法来实现它：

a）直接在ngClick表达式中切换变量：

<button type="button" ng-click="showErrorAlert = !showErrorAlert">×</button>

b）通过将变量名称传递给通用的“switch”函数来切换变量：

<button type="button" ng-click="switchBool('showErrorAlert')">×</button>

$scope.switchBool = function(var){
  $scope[var] = !$scope[var];
};

Answer 3

$scope.showErrorAlert = false;


$scope.switchBool = function(value) {
    value = !value;
};

将值传递给switchBool时，它会按值传递，而不是引用。因此，该值仅在该函数内更改。

您可以尝试传递var名称，例如$scope.showErrorAlert，然后在switchBool内执行类似的操作：

eval(value + " = !" + value);

行动中：http://jsfiddle.net/Npp2N/1/

$scope.showErrorAlert = false;
$scope.switchBool = function(value) {
    eval(value + " = !" + value);
};

console.log($scope.showErrorAlert); // false
$scope.switchBool("$scope.showErrorAlert");
console.log($scope.showErrorAlert); // true

为什么使用“切换”技术无法从HTML更改范围值？

3 个答案: