AngularJS $location 使用 $routeProvider 时未正确更新

Question

我有一个带有defaultController 的Angular JS 应用程序，它控制着应用程序的标题。然后我有一些其他控制器用于每个视图。视图加载在<main> 中。我使用$routeProvider 使用以下代码加载视图：

myapp.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
            when('/login', {
                templateUrl: 'templates/login.html',
                controller: 'loginController'
            }).
            when('/dashboard', {
                templateUrl: 'templates/dashboard.html',
                controller: 'dashboardController'
            }).
            ...

当加载的视图是仪表板时，我试图在标题内显示一个 LOGOUT 按钮，如果加载的视图是登录视图，则隐藏它。为了做到这一点，我在defaultController 上使用了$location 对象，并使用ng-class 从LOGOUT 按钮中正确添加和删除类。

只有一个问题：$location 在我第一次加载页面时为我提供了正确的路径，但是在我更改视图（由$routeProvider 更改）之后，该变量不再更新，所以当我实际上在 /#/dashboard 上，$location.url 仍在 /login 上。这里是控制器代码：

controllers.controller('defaultController', ['$scope', 'ipCookie', '$location', function($scope, ipCookie, $location) {
    $scope.url = $location.url();
    ...

我也尝试了$window.location.hash，结果相同。

有什么想法吗？

编辑：在接受答案之后，这是我在defaultController 上添加的内容，以使其正常工作

$scope.$on("$locationChangeSuccess", function() {
        $scope.url = $location.url();      
    });

Answer 1

加载默认控制器后，服务中的位置可能会更新。

您可以将$location 服务注入作用域并根据它在您的模板中做出决策（然后它将自动被监视和重新评估），或者您可以监听$locationChangeSuccess 事件。

注入时，你可以简单地$scope.location = $location，然后使用<a ng-hide="location.path() != '/something'">之类的东西。

$location 在根范围内广播 $locationChangeSuccess，因此您应该能够在任何可用范围内收听它：$scope.$on( "$locationChangeSuccess", function() { /* do something */ } );