2.3.1 前端 angular 插件angular ui router - OhNaNaSun/angularBlog GitHub Wiki
参考: angular 系列八 ui-router详细介绍及ngRoute工具区别 用法:
define(["app", "controllers/index", "controllers/login", "controllers/logout", "controllers/signup"],
function (app, index, login, logout, signup) {
return app.config(["$stateProvider", "$urlRouterProvider", function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state("/", {
url: "/",
templateUrl: 'partials/index.html',
controller: index
})
.state("/login", {
url: "/login",
templateUrl: "partials/login.html",
controller: login
})
.state("/logout", {
url: "/logout",
templateUrl: "partials/logout.html",
controller: logout
})
.state("/signup", {
url: "/",
templateUrl: "partials/singup.html",
controller: signup
})
}])
})
首页 index.html ui-view <----> templateUrl
controller、controllerProvider:指定任何已经被注册的控制器或者一个作为控制器的函数
resolve:在路由到达前预载入一系列依赖或者数据,然后注入到控制器中。
data:数据不会被注入到控制器中,用途是从父状态传递数据到子状态。
onEnter/onExit:进入或者离开当前状态的视图时会调用这两个函数 (7) 事件
state事件
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){ ... })
$rootScope.$on('$stateNotFound', function(event, unfoundState, fromState, fromParams){ ... })
$rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){ ... })
$rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error){ ... })