A router outlet is a placeholder that Angular dynamically fills based on the application's route.

Example

Here is an example from the tutorial on routing:

template: '''
  <h1>{{title}}</h1>
  <nav>
    <a [routerLink]="['Dashboard']">Dashboard</a>
    <a [routerLink]="['Heroes']">Heroes</a>
  </nav>
  <router-outlet></router-outlet>''',
Implements
  • OnDestroy
Annotations
  • @Directive(selector: "router-outlet", visibility: Visibility.none)

Constructors

RouterOutlet(ViewContainerRef _viewContainerRef, ComponentResolver _loader, Router _parentRouter, @Attribute("name") String nameAttr)

Properties

name String
read / write
onActivate → Stream
@Output('activate'), read-only
hashCode → int
The hash code for this object. [...]
read-only, inherited
runtimeType → Type
A representation of the runtime type of the object.
read-only, inherited

Methods

activate(ComponentInstruction nextInstruction) → Future
Called by the Router to instantiate a new component during the commit phase of a navigation. This method in turn is responsible for calling the routerOnActivate hook of its child.
deactivate(ComponentInstruction nextInstruction) → Future
Called by the Router when an outlet disposes of a component's contents. This method in turn is responsible for calling the routerOnDeactivate hook of its child.
ngOnDestroy() → void
Executed before the directive is removed from the DOM and destroyed. [...]
reuse(ComponentInstruction nextInstruction) → Future
Called by the Router during the commit phase of a navigation when an outlet reuses a component between different routes. This method in turn is responsible for calling the routerOnReuse hook of its child.
routerCanDeactivate(ComponentInstruction nextInstruction) → Future<bool>
Called by the Router during recognition phase of a navigation. [...]
routerCanReuse(ComponentInstruction nextInstruction) → Future<bool>
Called by the Router during recognition phase of a navigation. [...]
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
toString() → String
Returns a string representation of this object.
inherited

Operators

operator ==(other) → bool
The equality operator. [...]
inherited