質問

私は、アプリのヘッダを制御するdefaultControllerを持つ角度JSアプリケーションを持っています。それから私はそれぞれのビューに1つずつ他のコントローラを持っています。ビューは<main>にロードされます。このコードを使用して$routeProviderを使用してビューをロードします。

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

ロードされたビューがダッシュボードのときにヘッダ内のログアウトボタンを表示し、ロードされたビューがログインビューである場合は非表示にしています。 defaultControllerオブジェクトに$locationオブジェクトを持っていることを実行するために、ng-classを使用してログアウトボタンからクラスを正しく追加および削除します。

問題が1つしかありません。$ locationは、最初にページをロードしたときに正しいパスを表示しますが、変数がもう更新されない場合は、実際に$routeProviderに表示されます。 /#/dashboardはまだ$location.urlにあります。ここではコントローラコード:

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

私は同じ結果を持つ/loginでも試みました。

任意のアイデア?

編集:承認された回答の後、これは$window.location.hashを働かせるためにveを追加する

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

役に立ちましたか?

解決

デフォルトのコントローラがロードされた後に、場所はおそらくサービスで更新されます。

$locationサービスをスコープに注入し、それに基づいてテンプレート内の決定を下すことができます(それから自動的に監視され再評価されます)、または$locationChangeSuccessイベントを聞くことができます。

注入するときは、単に$scope.location = $locationを使用してから<a ng-hide="location.path() != '/something'">のようなものを使用することができます。

$locationはrootスコープで$locationChangeSuccessをブロードキャストするので、利用可能な範囲内でそれを聞くことができるはずです.$scope.$on( "$locationChangeSuccess", function() { /* do something */ } );

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top