RouterOutlet

directive

Acts as a placeholder that Angular dynamically fills based on the current router state.

See more...

NgModule

Selectors

Properties

Property Description
@Output('activate')activateEvents: EventEmitter<any>
@Output('deactivate')deactivateEvents: EventEmitter<any>
isActivated: boolean Read-Only
component: Object Read-Only
activatedRoute: ActivatedRoute Read-Only
activatedRouteData: Data Read-Only

Template variable references

Identifier Usage
outlet #myTemplateVar="outlet"

Description

Each outlet can have a unique name, determined by the optional name attribute. The name cannot be set or changed dynamically. If not set, default value is "primary".

<router-outlet></router-outlet>
<router-outlet name='left'></router-outlet>
<router-outlet name='right'></router-outlet>

A router outlet emits an activate event when a new component is instantiated, and a deactivate event when a component is destroyed.

<router-outlet
  (activate)='onActivate($event)'
  (deactivate)='onDeactivate($event)'></router-outlet>

Methods

ngOnDestroy()

ngOnDestroy(): void

Parameters

There are no parameters.

Returns

void
ngOnInit()

ngOnInit(): void

Parameters

There are no parameters.

Returns

void
detach()

Called when the RouteReuseStrategy instructs to detach the subtree

detach(): ComponentRef<any>

Parameters

There are no parameters.

Returns

ComponentRef<any>
attach()

Called when the RouteReuseStrategy instructs to re-attach a previously detached subtree

attach(ref: ComponentRef<any>, activatedRoute: ActivatedRoute)

Parameters
ref ComponentRef
activatedRoute ActivatedRoute
deactivate()

deactivate(): void

Parameters

There are no parameters.

Returns

void
activateWith()

activateWith(activatedRoute: ActivatedRoute, resolver: ComponentFactoryResolver)

Parameters
activatedRoute ActivatedRoute
resolver ComponentFactoryResolver

© 2010–2020 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v9.angular.io/api/router/RouterOutlet