## TemplateRef
表示可用于实例化嵌入视图的嵌入模板。
可以使用两种方式访问`TemplateRef`。通过放置在`<template>`元素(或带有`*`前缀的指令),并使用`TemplateRef`令牌将嵌入视图的`TemplateRef`注入到指令的构造函数中。 或者,您可以通过`Query`查询从组件或指令查询`TemplateRef`。
要基于模板实例化嵌入视图,请使用`ViewContainerRef`,这将创建视图并将其附加到视图容器。
### 如何使用
```html
<template [ngTemplateOutlet]="templateRefExpression"
[ngOutletContext]="objectExpression">
</template>
```
### 类定义
```typescript
class TemplateRef {
C
elementRef : ElementRef
createEmbeddedView(context: C) : EmbeddedViewRef<C>
}
```
### 属性
- C
- elementRef : `ElementRef`
嵌入视图的逻辑在视图中的归属位置。
从此TemplateRef创建的嵌入式视图的数据绑定和注入上下文从此位置的上下文继承。
通常,新的嵌入式视图附加到此位置的视图容器,但在高级用例中,视图可以附加到不同的容器,同时保留原始位置的数据绑定和注入上下文。
- createEmbeddedView(context: `C`) : `EmbeddedViewRef<C>`
- 说明
- 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
- 开发遇到的问题