AngularJS-UI-Router

标签：包括   dashboard   not   log   url   abstract   ict   top   ide   

涉及知识点：

$stateProvider,$urlRouteProvider

ui-href

$stateParams,$state

1.如何引用依赖angular-ui-router

1 angular.module(‘app‘,["ui.router"])
2 　　.config(function($stateProvider){
3 　　　　$stateProvider.state(stateName, stateCofig);
4 })

2.ui-router配置路由$stateProvider

.config(function($stateProvider) {
    $stateProvider.state(‘dashboard.home‘, { 
        url: ‘/home‘,
        views: {
           "content": {
                    controller: ‘HomeCtrl‘,
                    templateUrl: ‘dashboard/home/home.tpl.html‘ 
           }
        },
        data: { pageTitle: ‘Home‘ },
        restricted: true 
    });
 }) 

具体参数：$stateProvider.state(stateName, stateConfig)

stateName是string类型，stateConfig是object类型

stateConfig包含的字段：template, templateUrl, templateProvider, controller, controllerProvider, resolve, url, params, views, abstract, onEnter, onExit, reloadOnSearch, data

$stateProvider.state("home",{});//statConfig可以为空对象

//state可以有子父级
$stateProvider.state("home",{});
$stateProvider.state("home.child",{})

$stateProvider.state("home",{}).state("about",{}).state("photos",{});//state可以是链式的

3.$urlRouteProvider

$urlRouteProvider.when(whenPath, toPath)
$urlRouterProvider.otherwise(path)
$urlRouteProvider.rule(handler)

4.$state.go

$state.go(to, [,toParams],[,options])
形参to是string类型，必须，使用"^"或"."表示相对路径；
形参toParams可空，类型是对象；
形参options可空，类型是对象，字段包括：location为bool类型默认true,inherit为bool类型默认true, relative为对象默认$state.$current,notify为bool类型默认为true, reload为bool类型默认为false

$state.go(‘photos.detail‘)
$state.go(‘^‘)到上一级,比如从photo.detail到photo
$state.go(‘^.list‘)到相邻state,比如从photo.detail到photo.list
$state.go(‘^.detail.comment‘)到孙子级state，比如从photo.detail到photo.detial.comment

5.ui-sref

ui-sref=‘stateName‘
ui-sref=‘stateName({param:value, param:value})‘

参考URL：

http://www.cnblogs.com/littlemonk/p/5500801.html

https://github.com/angular-ui/ui-router/wiki/URL-Routing

http://www.cnblogs.com/littlemonk/p/5484322.html

AngularJS-UI-Router

标签：包括   dashboard   not   log   url   abstract   ict   top   ide   

原文地址：http://www.cnblogs.com/sophie_wang/p/6159840.html