模板语法
服务端渲染
API / @angular/router

RouterOutlet

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

一个占位符，Angular 会根据当前的路由器状态动态填充它。

@Directive({ selector: 'router-outlet', exportAs: 'outlet' }) class RouterOutlet implements OnDestroy, OnInit { activateEvents: new EventEmitter<any>() deactivateEvents: new EventEmitter<any>() get isActivated: boolean get component: Object get activatedRoute: ActivatedRoute get activatedRouteData: Data ngOnDestroy(): void ngOnInit(): void detach(): ComponentRef<any> attach(ref: ComponentRef<any>, activatedRoute: ActivatedRoute) deactivate(): void activateWith(activatedRoute: ActivatedRoute, resolver: ComponentFactoryResolver | null) }

选择器

router-outlet

输出参数

activate 绑定到 RouterOutlet.activateEvents
deactivate 绑定到 RouterOutlet.deactivateEvents

导出为

outlet

说明

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

A router outlet will emit an activate event any time a new component is being instantiated, and a deactivate event when it is being destroyed.

每当新组件实例化之后，路由出口就会发出一个激活事件；在销毁时则发出取消激活的事件。

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

属性

属性名类型说明
activateEvents
deactivateEvents
isActivated只读
component只读
activatedRoute只读
activatedRouteData只读

方法

ngOnDestroy()

ngOnDestroy(): void

参数

没有参数。

返回值

void

ngOnInit()

ngOnInit(): void

参数

没有参数。

返回值

void

detach()

Called when the RouteReuseStrategy instructs to detach the subtree

受 RouteReuseStrategy 的指示，从子树中分离开时调用

detach(): ComponentRef<any>

参数

没有参数。

返回值

ComponentRef<any>

attach()

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

RouteReuseStrategy 的指示，把以前分离的子树重新附加回来时调用

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

参数

ref

Type: ComponentRef.

activatedRoute

Type: ActivatedRoute.

deactivate()

deactivate(): void

参数

没有参数。

返回值

void

activateWith()

activateWith(activatedRoute: ActivatedRoute, resolver: ComponentFactoryResolver | null)

参数

activatedRoute

Type: ActivatedRoute.

resolver

Type: ComponentFactoryResolver | null.