honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs: update api reference for router outlet directive (#38166) 

Incorporate more specific information about multiple outlets and how to target them, with link to tutorial example.

PR Close #38166
This commit is contained in:
Judy Bogart 2020-07-21 11:00:09 -07:00 committed by Misko Hevery
parent 062b8d90af
commit 3c1866b5bb
1 changed files with 20 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/router/src/directives/router_outlet.ts
View File

@ -27,6 +27,21 @@ import {PRIMARY_OUTLET} from '../shared';
* <router-outlet name='right'></router-outlet>
* ```
*
* Named outlets can be the targets of secondary routes.
* The `Route` object for a secondary route has an `outlet` property to identify the target outlet:
*
* `{path: <base-path>, component: <component>, outlet: <target_outlet_name>}`
*
* Using named outlets and secondary routes, you can target multiple outlets in
* the same `RouterLink` directive.
*
* The router keeps track of separate branches in a navigation tree for each named outlet and
* generates a representation of that tree in the URL.
* The URL for a secondary route uses the following syntax to specify both the primary and secondary
* routes at the same time:
*
* `http://base-path/primary-route-path(outlet-name:route-path)`
*
* A router outlet emits an activate event when a new component is instantiated,
* and a deactivate event when a component is destroyed.
*
@ -35,6 +50,11 @@ import {PRIMARY_OUTLET} from '../shared';
* (activate)='onActivate($event)'
* (deactivate)='onDeactivate($event)'></router-outlet>
* ```
*
* @see [Routing tutorial](guide/router-tutorial-toh#named-outlets "Example of a named
* outlet and secondary route configuration").
* @see `RouterLink`
* @see `Route`
* @ngModule RouterModule
*
* @publicApi