如何在AngularJS中發生路線更改時設置ngclass更改？

我想在路線改變時在我的主要.container類上添加一個班級。如何在AngularJS中發生路線更改時設置ngclass更改？

我現在簡單的解決方案包括在每一個主菜單的URL的ng-click（在頁面上沒有其他網址）：

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

    $scope.setMain = function(value){ $scope.isMain = value }; 

}]);

然後在我的html：

<div ng-controller="MainCtrl" class="container" ng-class="{'main': isMain}"> 
    <ul class="main-menu"> 
    <li><a href="#" ng-click="setMain(true)"></li> 
    <li><a href="#/page-1" ng-click="setMain(false)"></li> 
    <li><a href="#/page-2" ng-click="setMain(false)"></li> 
    </ul> 
    <div ng-view></div> 
</div>

這似乎工作確定爲只要我需要添加更多的URL，問題是當用戶沒有點擊任何鏈接並直接訪問一個url時，他沒有得到主要的類。

有沒有更好的方法來做到這一點？

來源

2014-03-01 hitautodestruct

當你說「直接訪問一個網址」，你的意思是他們鍵入地址欄，路線編程更改，或其他完全？ – maf748

@ maf748是的，我的意思是他們把它輸入到地址欄中。 – hitautodestruct

您可以使用幾個不同的選項，但我認爲最簡單的方法是通過查看$location來設置控制器初始化的$scope.isMain值。因此，控制器內，你可以有這樣的：

var loc = $location.path(); 
if(loc === /* some route rule you require */){ 
    $scope.isMain = true; 
}

看一看這裏：作爲向下探底有什麼樣的數據，你可以與問候到路由訪問了幾個不同的例子的例子http://docs.angularjs.org/api/ngRoute/service/ $路線。

來源

2014-03-01 14:22:23

我想過使用路由參數，但這意味着我必須爲每個視圖加載相同的控制器。糾正我，如果我錯了，但如果我想使用一個單獨的控制器的意見之一，我將不得不建立某種服務來分享路線。 – hitautodestruct

或者你可以創建一個父控制器來處理基於路由的狀態，並有獨立的子控制器。 –

好主意。這是你在答案中的意思嗎？ – hitautodestruct

如何在AngularJS中發生路線更改時設置ngclass更改？

回答

相關問題