## EmbeddedViewRef
表示Angular視圖。
視圖是應用程序UI的基本構建塊。它是元素創建和銷毀的最小組合體。
視圖中元素的屬性可以更改,但視圖中元素的結構(數量和順序)不能更改。更改元素的結構只能通過`ViewContainerRef`插入,移動和刪除嵌套視圖來完成。每個視圖可以包含多個視圖容器。
示例:
例如此模板...
```html
Count: {{ items.length }}
<ul>
<li *ngFor="let item of items">{{ item }}</li>
</ul>
```
這里有兩個`TemplateRef`
外層`TemplateRef`
```html
Count: {{ items.length }}
<ul>
<template ngFor let-item [ngForOf]="items"></template>
</ul>
```
里面的`TemplateRef`
```html
<li>{{ item }}</li>
```
請注意,原始模板分為兩個單獨的TemplateRef。
外部/內部TemplateRefs然后組裝成如下視圖:
```html
<!-- ViewRef: outer-0 -->
Count: 2
<ul>
<template view-container-ref></template>
<!-- ViewRef: inner-1 --><li>first</li><!-- /ViewRef: inner-1 -->
<!-- ViewRef: inner-2 --><li>second</li><!-- /ViewRef: inner-2 -->
</ul>
<!-- /ViewRef: outer-0 -->
```
### 類定義
```typescript
class EmbeddedViewRef {
C
context : C
rootNodes : any[]
destroy() : void
}
```
### 屬性
- C
- context: `C`
- rootNodes : `any[]`
- destroy() : `void` 銷毀視圖及其關聯的數據結構。
- 說明
- angular 1.x
- ngModelController
- ngOptions
- ngModelOptions
- lifecycle
- directive
- angular 2
- @angular/forms
- 類
- AbstractControl
- AbstractControlDirective
- AbstractFormGroupDirective
- FormControl
- FormArray
- FormBuilder
- FormGroup
- NgControl
- 接口
- controlValueAccessor
- 指令
- DefaultValueAccessor
- Angular 2 生命周期
- OnInit
- DoCheck
- @angular/router
- 配置
- Routes
- 指令
- RouterOutlet
- RouterLink
- 接口
- ActivatedRoute
- UrlTree
- NavigationExtras
- ActivatedRouteSnapshot
- RouterStateSnapshot
- 類
- UrlSegment
- UrlSegmentGroup
- UrlSerializer
- DefaultUrlSerializer
- Router
- bug記得
- @angular/http
- 類
- Http
- Body
- Response
- ResponseOptions
- Header
- Request
- RequestOptions
- URLSearchParams
- @angular/core
- decorator
- Component-decorator
- animation
- DI
- linker
- TemplateRef
- ElementRef
- EmbeddedViewRef
- ViewRef
- ViewContainerRef
- Query
- ComponentFactory
- ComponentRef
- Renderer
- change_detection
- KeyValueDiffers
- IterableDiffers
- ChangeDetectorRef
- ChangeDetectionStrategy
- Zone
- ngZone
- @angular/common
- 指令
- NgTemplateOutlet
- QueryList
- bootstrap4
- card
- form
- 重點關注博客
- 學習過的文章
- 筆記
- Angular 2 雙向綁定
- 將字符串解析成DOM
- rx相關
- operators
- combineLatest
- combineAll
- concat(All, Map, *MapTo)
- 背壓(backpressure)
- js事件keycode對應表
- 裝飾器
- 有用的代碼摘錄
- 日期操作
- 數量操作
- 字符操作
- rxjs問題
- 小示例
- h5面試準備
- react
- 開發遇到的問題