constructor(private injector: Injector, private r: ComponentFactoryResolver) { let factory = this.r.resolveComponentFactory(AppComponent); let componentRef = factory.create(injector); let view = componentRef.hostView; }
2.Angular 2 Component 组件中定义的 <template> 模板元素为什么渲染后会被移除 ？
因为 <template> 模板元素，已经被 Angular 2 解析并封装成 TemplateRef 实例，通过 TemplateRef 实例，我们可以方便地创建内嵌视图(Embedded View)，我们不需要像开篇中的例子那样，手动操作 <template> 模板元素。
3.ViewRef 与 EmbeddedViewRef 之间有什么关系 ？
ViewRef 用于表示 Angular View(视图)，视图是可视化的 UI 界面。EmbeddedViewRef 继承于 ViewRef，用于表示 <template> 模板元素中定义的 UI 元素。
ViewRef
// @angular/core/src/linker/view_ref.d.ts export declare abstract class ViewRef { destroyed: boolean; abstract onDestroy(callback: Function): any; }
EmbeddedViewRef
// @angular/core/src/linker/view_ref.d.ts export declare abstract class EmbeddedViewRef<C> extends ViewRef { context: C; rootNodes: any[]; // 保存<template>模板中定义的元素 abstract destroy(): void; // 用于销毁视图 }
总结
Angular 2 中 TemplateRef 与 ViewContainerRef 的概念对于初学者来说会比较羞涩难懂，本文从基本的 HTML 5 <template> 模板元素开始，介绍了如何操作和应用页面中定义的模板。然后通过实例介绍了 Angular 2 中 TemplateRef 和 ViewContainerRef 的定义和作用。希望通过这篇文章，读者能更好的理解 TemplateRef 与 ViewContainerRef。
好了，以上就是这篇文章的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
您可能感兴趣的文章: