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){ ... })

⚠️ **GitHub.com Fallback** ⚠️