Angular之ViewContainerRef、ViewRef、EmbeddedViewRef、TemplateRef

1. ViewContainerRef 视图容器

ViewContainerRef 可以将一个或多个视图附着到组件中的容器。通过它可以动态创建内嵌视图、动态创建组件，可以添加、移动、删除视图容器中的视图。

abstract class ViewContainerRef {
   
  abstract element: ElementRef
  abstract injector: Injector
  abstract parentInjector: Injector
  abstract length: number
  abstract clear(): void
  abstract get(index: number): ViewRef | null

  // 创建内嵌视图(实例化一个内嵌视图，并把它插入到该容器中)，参数1：模板引用TemplateRef，参数2：要挂在在内嵌视图上的上下文对象。参数3：从 0 开始的索引，表示新视图要插入到当前容器的哪个位置。 如果没有指定，就把新的视图追加到最后。最终返回值是个内嵌视图EmbeddedViewRef。
  abstract createEmbeddedView<C>(templateRef: TemplateRef<C>, context?: C, index?: number): EmbeddedViewRef<C>  ⭐️⭐️

  // 在视图容器上动态创建组件
  abstract createComponent<C>(componentType: Type<C>, options?: {
    index