Angularjs-ui-router

Source: Internet
Author: User

Knowledge points involved:

$stateProvider,$urlRouteProvider

Ui-href

$stateParams, $state

1. How to reference dependent Angular-ui-router

1 angular.module (' app ', [' Ui.router '])2 . config (function($stateProvider) {  3$stateProvider. State (StateName, statecofig); 4 })     

2.ui-router Configuring Routing $stateprovider

. config (function($stateProvider) {    $stateProvider. State (' Dashboard.home ', {         ') /home ', views        :           {"content":                    {' Homectrl ',                    ' dashboard/home/ home.tpl.html        '        }, ' Home ' }        ,true     

Specific parameters: $stateProvider. State (StateName, Stateconfig)

StateName is a string type, Stateconfig is an object type

Stateconfig contains fields: template, Templateurl, Templateprovider, controller, Controllerprovider, resolve, url, params, views, Abstract, OnEnter, OnExit, Reloadonsearch, data

$stateProvider. State ("Home", {}); // Statconfig can be an empty object
State can have child-parent
$stateProvider. State ("Home", {}), $stateProvider. State ("Home.child", {}) $stateProvider the.State (" Home ", {}). State (' about ', {}). State (" Photos ", {}); // the state can be chain -

3. $urlRouteProvider

$urlRouteProvider. When (Whenpath, Topath)
$urlRouterProvider. otherwise (path)
$urlRouteProvider. Rule (handler)

4. $state. Go

$state. Go (To, [, Toparams],[,options])
parameter to is of type string and must use "^" or "." Represents a relative path;
The parameter toparams is nullable, and the type is an object;
Parameter options are nullable, types are objects, fields include: location is bool type default true,inherit is bool type default true, relative is object default $state. $current, Notify to bool type default to TRUE, reload to bool type default to False

$state. Go (' Photos.detail ')
$state. Go (' ^ ') to the upper level, e.g. from Photo.detail to photo
$state. Go (' ^.list ') to neighboring state, e.g. from Photo.detail to Photo.list
$state. Go (' ^.detail.comment ') to grandchild state, e.g. from Photo.detail to Photo.detial.comment

5.ui-sref

ui-sref= ' StateName '
Ui-sref= ' StateName ({param:value, param:value}) '

Reference 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

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.