301 lines
4.3 KiB
Plaintext
301 lines
4.3 KiB
Plaintext
|
|
p.location-badge.
|
|
exported from <a href='../router'>angular2/router</a>
|
|
defined in <a href="https://github.com/angular/angular/tree/2.0.0-alpha.32/modules/angular2/src/router/router.ts#L22-L284">angular2/src/router/router.ts (line 22)</a>
|
|
|
|
:markdown
|
|
# Router
|
|
The router is responsible for mapping URLs to components.
|
|
|
|
You can see the state of the router by inspecting the read-only field `router.navigating`.
|
|
This may be useful for showing a spinner, for instance.
|
|
|
|
## Concepts
|
|
Routers and component instances have a 1:1 correspondence.
|
|
|
|
The router holds reference to a number of "outlets." An outlet is a placeholder that the
|
|
router dynamically fills in depending on the current URL.
|
|
|
|
When the router navigates from a URL, it must first recognizes it and serialize it into an
|
|
`Instruction`.
|
|
The router uses the `RouteRegistry` to get an `Instruction`.
|
|
|
|
|
|
.l-main-section
|
|
h2 Members
|
|
.l-sub-section
|
|
h3 constructor
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
constructor(registry: RouteRegistry, _pipeline: Pipeline, parent: Router, hostComponent: any)
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 navigating
|
|
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 lastNavigationAttempt
|
|
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 registry
|
|
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 parent
|
|
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 hostComponent
|
|
|
|
|
|
:markdown
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 childRouter
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
childRouter(hostComponent: any)
|
|
|
|
:markdown
|
|
|
|
Constructs a child router. You probably don't need to use this unless you're writing a reusable
|
|
component.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 registerOutlet
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
registerOutlet(outlet: RouterOutlet)
|
|
|
|
:markdown
|
|
|
|
Register an object to notify of route changes. You probably don't need to use this unless
|
|
you're writing a reusable component.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 config
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
config(definitions: List<RouteDefinition>)
|
|
|
|
:markdown
|
|
|
|
Dynamically update the routing configuration and trigger a navigation.
|
|
|
|
# Usage
|
|
|
|
```
|
|
router.config([
|
|
{ 'path': '/', 'component': IndexComp },
|
|
{ 'path': '/user/:id', 'component': UserComp },
|
|
]);
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 navigate
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
navigate(url: string)
|
|
|
|
:markdown
|
|
|
|
Navigate to a URL. Returns a promise that resolves when navigation is complete.
|
|
|
|
If the given URL begins with a `/`, router will navigate absolutely.
|
|
If the given URL does not begin with `/`, the router will navigate relative to this component.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 commit
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
commit(instruction: Instruction)
|
|
|
|
:markdown
|
|
|
|
Updates this router and all descendant routers according to the given instruction
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 subscribe
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
subscribe(onNext: (value: any) => void)
|
|
|
|
:markdown
|
|
|
|
Subscribe to URL updates from the router
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 deactivate
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
deactivate(instruction: Instruction)
|
|
|
|
:markdown
|
|
|
|
Removes the contents of this router's outlet and all descendant outlets
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 recognize
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
recognize(url: string)
|
|
|
|
:markdown
|
|
|
|
Given a URL, returns an instruction representing the component graph
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 renavigate
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
renavigate()
|
|
|
|
:markdown
|
|
|
|
Navigates to either the last URL successfully navigated to, or the last URL requested if the
|
|
router has yet to successfully navigate.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.l-sub-section
|
|
h3 generate
|
|
|
|
|
|
pre.prettyprint
|
|
code.
|
|
generate(linkParams: List<any>)
|
|
|
|
:markdown
|
|
|
|
Generate a URL from a component name and optional map of parameters. The URL is relative to the
|
|
app's base href.
|
|
|
|
|
|
|
|
|
|
|
|
|