Docs4dev
Docs
angular / 11 / api / core / viewcontainerref.html

ViewContainerRef

class

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

See more...

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
}

See also

Description

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.

Properties

Property Description
abstract element: ElementRef Read-Only

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.

Access the ViewContainerRef of an element by placing a Directive injected with ViewContainerRef on the element, or use a ViewChild query.
abstract injector: Injector Read-Only

The dependency injector for this view container.
abstract parentInjector: Injector Read-Only
abstract length: number Read-Only

Reports how many views are currently attached to this container.

Methods

clear()

Destroys all views in this container.

abstract clear(): void

Parameters

There are no parameters.

Returns

void
get()

Retrieves a view from this container.

abstract get(index: number): ViewRef | null

Parameters
index number

The 0-based index of the view to retrieve.
Returns

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

Instantiates an embedded view and inserts it into this container.

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

Parameters
templateRef TemplateRef

The HTML template that defines the view.
context C

Optional. Default is undefined.
index number

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.

Optional. Default is undefined.
Returns

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

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>

Parameters
componentFactory ComponentFactory

The factory to use.
index number

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.

Optional. Default is undefined.
injector Injector

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

Optional. Default is undefined.
projectableNodes any[][]

Optional. Default is undefined.
ngModule NgModuleRef

Optional. Default is undefined.
Returns

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

Inserts a view into this container.

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

Parameters
viewRef ViewRef

The view to insert.
index number

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

Optional. Default is undefined.
Returns

ViewRef: The inserted ViewRef instance.
move()

Moves a view to a new location in this container.

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

Parameters
viewRef ViewRef

The view to move.
currentIndex number
Returns

ViewRef: The moved ViewRef instance.
indexOf()

Returns the index of a view within the current container.

abstract indexOf(viewRef: ViewRef): number

Parameters
viewRef ViewRef

The view to query.
Returns

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

Destroys a view attached to this container

abstract remove(index?: number): void

Parameters
index number

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

Optional. Default is undefined.
Returns

void
detach()

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

Parameters
index number

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

Optional. Default is undefined.
Returns

ViewRef | null

© 2010–2021 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v11.angular.io/api/core/ViewContainerRef