使用ui-route很多的時候需要控制頁面跳轉(zhuǎn)咱台。
而監(jiān)聽路由狀態(tài)的變化是最開始的切入點俭驮,我們可以再注入$location服務(wù)進行跳轉(zhuǎn)邏輯管理。
在ui-route的api-doc中混萝,便給我們介紹了幾個event逸嘀,這樣可以使得我們很簡單就能知道路由變化的狀態(tài)。
以下我就記錄一下ui-route0.x版本的監(jiān)聽方法
var app=angular.module(“app”,[“ui-route”])
//先配置一些跳轉(zhuǎn)頁面
app.config(“$stateProvider”,”$urlStateProvider”,function($stateProvider,$urlStateProvider){
? ? $stateProvider.state(“l(fā)ogin”,{
? ? ? ? url:”/login”
? ? ? ? templateUrl:”login.html”
? ? })
})
//我們開始初始化全局監(jiān)聽事件
app.run(“$rootScope”崭倘,[function($rootScope){
? ? //訂閱一個監(jiān)聽事件
? ? $rootScope.$on(“$stateChangeStart”,function(toState,fromState){
? ? function body.........
? })
}])
說明:
&stateChangeStart是ui-route模塊內(nèi)置的事件
回調(diào)函數(shù)的參數(shù)是固定的,toState,fomState分別表示“跳轉(zhuǎn)到的狀態(tài)”琅坡、“跳轉(zhuǎn)前的狀態(tài)”
這樣注冊完一個事件,在跳轉(zhuǎn)的時候就會自動監(jiān)聽售躁。響應(yīng)你給定的一系列邏輯了茴晋。
更多api 可參考源碼:https://github.com/angular-ui/ui-router