EmbeddedViewRef
Represents an Angular view in a view container.
An embedded view can be referenced from a component
other than the hosting component whose template defines it, or it can be defined
independently by a TemplateRef.
abstract class EmbeddedViewRef<C> extends ViewRef {
abstract context: C
abstract rootNodes: any[]
// inherited from core/ViewRef
abstract destroyed: boolean
abstract destroy(): void
abstract onDestroy(callback: Function): any
// inherited from core/ChangeDetectorRef
abstract markForCheck(): void
abstract detach(): void
abstract detectChanges(): void
abstract checkNoChanges(): void
abstract reattach(): void
}
See also
Description
Properties of elements in a view can change, but the structure (number and order) of elements in a view cannot. Change the structure of elements by inserting, moving, or removing nested views in a view container.
Properties
| Property | Description |
|---|---|
abstract context: C
|
Read-only.
The context for this view, inherited from the anchor element. |
abstract rootNodes: any[]
|
Read-only.
The root nodes for this embedded view. |
Usage notes
The following template breaks down into two separate TemplateRef instances,
an outer one and an inner one.
Count: {{items.length}}
<ul>
<li *ngFor="let item of items">{{item}}</li>
</ul>
This is the outer TemplateRef:
Count: {{items.length}}
<ul>
<ng-template ngFor let-item [ngForOf]="items"></ng-template>
</ul>
This is the inner TemplateRef:
<li>{{item}}</li>
The outer and inner TemplateRef instances are assembled into views as follows:
<!-- ViewRef: outer-0 -->
Count: 2
<ul>
<ng-template view-container-ref></ng-template>
<!-- ViewRef: inner-1 --><li>first</li><!-- /ViewRef: inner-1 -->
<!-- ViewRef: inner-2 --><li>second</li><!-- /ViewRef: inner-2 -->
</ul>
<!-- /ViewRef: outer-0 -->