Class Description
Represents an Angular View.
A View is a fundamental building block of the application UI. It is the smallest grouping of Elements which are created and destroyed together.
Properties of elements in a View can change, but the structure (number and order) of elements in
a View cannot. Changing the structure of Elements can only be done by inserting, moving or
removing nested Views via a ViewContainerRef
. Each View can contain many View Containers.
Example
Given this template...
Count: {{items.length}}
<ul>
<li *ngFor="let item of items">{{item}}</li>
</ul>
We have two TemplateRef
s:
Outer TemplateRef
:
Count: {{items.length}}
<ul>
<ng-template ngFor let-item [ngForOf]="items"></ng-template>
</ul>
Inner TemplateRef
:
<li>{{item}}</li>
Notice that the original template is broken down into two separate TemplateRef
s.
The outer/inner TemplateRef
s are then assembled into views like so:
<!-- 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 -->
exported from core/index, defined in core/src/linker/view_ref.ts