Angular JS - 全局变量刷新问题

Question

我正在定义一个全局$ rootScope变量：

var app = angular.module("demoApp", []);
app.run(function ($rootScope) {
    $rootScope.test = "Global"; 
});

并且在我的html中，如果我将其作为{{test}}访问它，则可以正常工作。

但是在我的控制器中，如果我在控制器中更改此变量的值并使用$ location.path（....）更改位置;那么这个全局变量值保持不变。

function myCtrl($location, $rootScope) {
    $rootScope.test = "Changed to Local"; 
    $location.path("New.html");
}

现在，在我的New.html中，如果我访问此变量{{test}}，则会打印为“全局”而不是“更改为本地”。但是，如果我刷新页面，那么它可以正常工作。

请帮助您避免如何避免此刷新问题。我可以在'app.run .....'中使用resolve / promise吗？如果是这样的话怎么做。

Answer 1

这是因为原型继承的工作方式（explained here）。这意味着您的本地范围将获得test的副本而不是对它的引用。更改rootScope的值不会更改本地作用域的副本。

最简单的“修复”是将您希望在对象中全局的rootScope属性包装（通过引用传递对象）。

$rootScope.global = { test: "Global" };

然后，您将使用{{ global.test }}在视图中引用它。更改$scope.global.test也会自动更改$rootScope.global.test，反之亦然。

Answer 2

解决方案是将全局变量定义为'$ routeChangeSuccess'。

var app = angular.module("demoApp", []);
app.run(function ($rootScope) {
    $rootScope.$on('$routeChangeSuccess', function () {
        $rootScope.test = "Global"; 
    });
});

感谢您的详细信息。