Угловое, $ route.current возвращения неопределенными, но $ маршрут имеет .Current свойство

Question

У меня есть контроллер:

app.controller('NavbarController', ['$scope', '$route', function($scope, $route) { 
    console.log($route); 
    console.log($route.current) 
}]); 

Но когда я пытаюсь использовать $route.current я получаю неопределен, я понятия не имею, почему, как $ маршрут имеет propety, когда я console.log($route)

у меня есть

.when('/', { 
     templateUrl: '/home', 
     controller: 'HomeController', 
     activeTab: 'home' 
    }). 

Мне нужно получить доступ к $route.current.$$route.activeTab, чтобы я мог получить переменную и установить соответствующий класс.

Полный контроллер:

var app = angular.module('PugIt', ['ngRoute', 'ui.bootstrap']) 

app.config(function($routeProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: '/home', 
     controller: 'HomeController', 
     activeTab: 'home' 
    }). 
    when('/help', { 
     templateUrl: '/help', 
     controller: 'HelpController', 
     activeTab: 'help' 
    }). 
    when('/donate', { 
     templateUrl: '/donate', 
     controller: 'DonateController', 
     activeTab: 'donate' 
    }). 
    when('/server', { 
     templateUrl: '/server', 
     controller: 'ServerController', 
     activeTab: 'server' 
    }). 
    when('/server/new', { 
     templateUrl: '/server/new', 
     controller: 'NewServerController', 
     activeTab: 'serverNew' 
    }). 
    otherwise({ 
     redirectTo: '/' 
    }); 
}); 

app.controller('HomeController', ['$scope', '$route', function($scope, $route) { 

}]); 

app.controller('HelpController', ['$scope', '$route', function($scope, $route) { 

}]); 

app.controller('DonateController', ['$scope', '$route', function($scope, $route) { 

}]); 

app.controller('ServerController', ['$scope', '$route', function($scope, $route) { 

}]); 

app.controller('NewServerController', ['$scope', '$route', function($scope, $route) { 
}]); 

app.controller('NavbarController', function($scope, $rootScope) { 
    $route.activeTab = $route.current.$$route.activeTab; 
}); 

Который затем устанавливает активный класс с:

// Navbar 
    <div ng-controller="NavbarController"> 
     <li ng-class="{'active': activeTab == 'home'}"><a href="#/">Home</a></li> 
    </div> 
    // End of Navbar 
    <div ng-view></div> 

Answer 1

Поскольку вы должны отслеживать ваши маршруты, вы можете определенно $watch изменения:

.controller('NavbarController', function($scope, $route) { 
    $scope.$route = $route; 
    $scope.$watch("$route.current.$$route.activeTab", function(v){ 
    $scope.activeTab = v; 
    } 
}); 

Но это создает ненужную $watch. Это не так уж плохо, так как это только один, но это было бы чище слушать $routeChangeSuccess события вместо:

.controller('NavbarController', function($scope, $route) { 
    $scope.$route = $route; 
    $scope.$on("$routeChangeSuccess", function(event, current, previous){ 
    $scope.activeTab = current.$$route.activeTab; 
    } 
}); 

Answer 2

Скорее всего, текущий маршрут не установлен, когда NavController загружен.

Что вы можете сделать в вашем NavController, чтобы следить за $route.current и после его установки \ изменить, реализовать логику в обработчике часов

$scope.$watch(function() { 
    return $route.current; 
},function(newValue,oldValue) { 
    //implement logic here 
});