javascript - 在函数中传递 $scope 变量不会改变

Question

我的这个应用有不同的主题，用户可以从导航栏中选择。此时我只是试图将变量从 false 更改为 true。

这是我正在为导航编写的代码:

   <li>
       <a  ng-click="toggleTheme(blackWhite)">  Black and White theme</a>
   </li>

这是 Controller 中的代码。

 $scope.blackWhite = false;
 //other themes are false
 $scope.toggleTheme = function(theme){
 theme = !theme;
 console.log($scope.blackWhite);//its still false
 }

我该怎么做？谢谢

Answer 1

您实际上是将 $scope.blackWhite 的值传递给该函数，而不是对 $scope.blackWhite 的引用。因此，您需要使用新值更新 $scope 变量，如下所示:

$scope.toggleTheme = function(theme) {
    $scope.blackWhite = !theme;
}

或者，更好的是，根本不传递变量，因为您只是切换 bool 值:

$scope.toggleTheme = function() {
    $scope.blackWhite = !$scope.blackWhite;
}

那么您的标记将是:

<a ng-click="toggleTheme()">Black and White theme</a>