ViewContainerRef

表示可以将一个或多个视图附着到组件中的容器。

Represents a container where one or more views can be attached to a component.

查看"说明"...

      
      abstract class ViewContainerRef {
  abstract element: ElementRef
  abstract injector: Injector
  abstract parentInjector: Injector
  abstract length: number
  abstract clear(): void
  abstract get(index: number): ViewRef | null
  abstract createEmbeddedView<C>(templateRef: TemplateRef<C>, context?: C, index?: number): EmbeddedViewRef<C>
  abstract createComponent<C>(componentFactory: ComponentFactory<C>, index?: number, injector?: Injector, projectableNodes?: any[][], ngModule?: NgModuleRef<any>): ComponentRef<C>
  abstract insert(viewRef: ViewRef, index?: number): ViewRef
  abstract move(viewRef: ViewRef, currentIndex: number): ViewRef
  abstract indexOf(viewRef: ViewRef): number
  abstract remove(index?: number): void
  abstract detach(index?: number): ViewRef | null
}
    

参见

说明

可以包含宿主视图(当用 createComponent() 方法实例化组件时创建)和内嵌视图(当用 createEmbeddedView() 方法实例化 TemplateRef 时创建)。

Can contain host views (created by instantiating a component with the createComponent() method), and embedded views (created by instantiating a TemplateRef with the createEmbeddedView() method).

视图容器的实例还可以包含其它视图容器,以创建层次化视图

A view container instance can contain other view containers, creating a view hierarchy.

属性

属性说明
abstract element: ElementRef 只读

锚点元素用来指定本容器在父容器视图中的位置。 每个视图容器都只能有一个锚点元素,每个锚点元素也只能属于一个视图容器。

Anchor element that specifies the location of this container in the containing view. Each view container can have only one anchor element, and each anchor element can have only a single view container.

视图的根元素会附着到该容器上,在渲染好的视图中会变成锚点元素的兄弟。

Root elements of views attached to this container become siblings of the anchor element in the rendered view.

可以在元素上放置注入了 ViewContainerRefDirective 来访问元素的 ViewContainerRef。也可以使用 ViewChild 进行查询。

Access the ViewContainerRef of an element by placing a Directive injected with ViewContainerRef on the element, or use a ViewChild query.

abstract injector: Injector 只读

该视图容器的依赖注入器

The dependency injector for this view container.

abstract parentInjector: Injector 只读
abstract length: number 只读

报告目前附加到本容器的视图的数量。

Reports how many views are currently attached to this container.

方法

销毁本容器中的所有视图。

Destroys all views in this container.

abstract clear(): void
      
      abstract clear(): void
    
参数

没有参数。

返回值

void

从该容器中获取一个视图

Retrieves a view from this container.

abstract get(index: number): ViewRef | null
      
      abstract get(index: number): ViewRef | null
    
参数
index number

所要获取视图的从 0 开始的索引。

The 0-based index of the view to retrieve.

返回值

ViewRef 实例,如果索引超出范围则为 0。

ViewRef | null: The ViewRef instance, or null if the index is out of range.

实例化一个内嵌视图,并把它插入到该容器中。

Instantiates an embedded view and inserts it into this container.

abstract createEmbeddedView<C>(templateRef: TemplateRef<C>, context?: C, index?: number): EmbeddedViewRef<C>
      
      abstract createEmbeddedView<C>(templateRef: TemplateRef<C>, context?: C, index?: number): EmbeddedViewRef<C>
    
参数
templateRef TemplateRef

用来定义视图的 HTML 模板。

The HTML template that defines the view.

context C

可选. 默认值是 undefined.

index number

从 0 开始的索引,表示新视图要插入到当前容器的哪个位置。 如果没有指定,就把新的视图追加到最后。

The 0-based index at which to insert the new view into this container. If not specified, appends the new view as the last entry.

可选. 默认值是 undefined.

返回值

新创建的这个视图的 ViewRef 实例。

EmbeddedViewRef<C>: The ViewRef instance for the newly created view.

实例化一个 Component并把它的宿主视图插入到本容器的指定 index 处。

Instantiates a single component and inserts its host view into this container.

abstract createComponent<C>(componentFactory: ComponentFactory<C>, index?: number, injector?: Injector, projectableNodes?: any[][], ngModule?: NgModuleRef<any>): ComponentRef<C>
      
      abstract createComponent<C>(componentFactory: ComponentFactory<C>, index?: number, injector?: Injector, projectableNodes?: any[][], ngModule?: NgModuleRef<any>): ComponentRef<C>
    
参数
componentFactory ComponentFactory

要使用的工厂。

The factory to use.

index number

从 0 开始的索引,表示新组件的宿主视图要插入到当前容器的哪个位置。 如果没有指定,就把新的视图追加到最后。

The index at which to insert the new component's host view into this container. If not specified, appends the new view as the last entry.

可选. 默认值是 undefined.

injector Injector

一个注入器,将用作新组件的父注入器。

The injector to use as the parent for the new component.

可选. 默认值是 undefined.

projectableNodes any[][]

可选. 默认值是 undefined.

ngModule NgModuleRef

可选. 默认值是 undefined.

返回值

新组件的实例,包含宿主视图。

ComponentRef<C>: The new component instance, containing the host view.

把一个视图插入到当前容器中。

Inserts a view into this container.

abstract insert(viewRef: ViewRef, index?: number): ViewRef
      
      abstract insert(viewRef: ViewRef, index?: number): ViewRef
    
参数
viewRef ViewRef

要插入的视图。

The view to insert.

index number

从 0 开始的索引,表示该视图要插入到当前容器的哪个位置。 如果没有指定,就把新的视图追加到最后。

The 0-based index at which to insert the view. If not specified, appends the new view as the last entry.

可选. 默认值是 undefined.

返回值

插入后的 ViewRef 实例。

ViewRef: The inserted ViewRef instance.

把一个视图移到容器中的新位置。

Moves a view to a new location in this container.

abstract move(viewRef: ViewRef, currentIndex: number): ViewRef
      
      abstract move(viewRef: ViewRef, currentIndex: number): ViewRef
    
参数
viewRef ViewRef

要移动的视图。

The view to move.

currentIndex number
返回值

移动后的 ViewRef 实例。

ViewRef: The moved ViewRef instance.

返回某个视图在当前容器中的索引。

Returns the index of a view within the current container.

abstract indexOf(viewRef: ViewRef): number
      
      abstract indexOf(viewRef: ViewRef): number
    
参数
viewRef ViewRef

要查询的视图。

The view to query.

返回值

本视图在其容器中的从 0 开始的索引,如果没找到,则返回 -1

number: The 0-based index of the view's position in this container, or -1 if this container doesn't contain the view.

销毁附着在该容器中的某个视图

Destroys a view attached to this container

abstract remove(index?: number): void
      
      abstract remove(index?: number): void
    
参数
index number

要销毁的视图的从 0 开始的索引。 如果不指定 index,则移除容器中的最后一个视图。

The 0-based index of the view to destroy. If not specified, the last view in the container is removed.

可选. 默认值是 undefined.

返回值

void

从当前容器中分离某个视图,但不会销毁它。 通常会和 insert() 一起使用,在当前容器中移动一个视图。

Detaches a view from this container without destroying it. Use along with insert() to move a view within the current container.

abstract detach(index?: number): ViewRef | null
      
      abstract detach(index?: number): ViewRef | null
    
参数
index number

要分离的视图的从 0 开始的索引。 如果省略 index 参数,则拆出最后一个 ViewRef

The 0-based index of the view to detach. If not specified, the last view in the container is detached.

可选. 默认值是 undefined.

返回值

ViewRef | null