Angular createEmbeddedView和createComponent之间有什么区别？

我混淆了

createEmbeddedView

和

createComponent

的用例，即何时使用哪一个

请提供一些案例，说明在“动态创建场景”中使用它们的合适设置。

请参阅或阅读我用示例解释差异的地方

这两种方法都用于向组件视图（DOM）动态添加内容。此内容可以是模板，也可以是基于组件的内容。在Angular中，我们通常使用。这两种方法都可以在上面使用：

class ViewContainerRef {
    ...
    createEmbeddedView<C>(templateRef: TemplateRef<C>, context?: C, index?: number): EmbeddedViewRef<C>
    createComponent<C>(componentFactory: ComponentFactory<C>, index?: number, injector?: Injector, projectableNodes?: any[][], ngModule?: NgModuleRef<any>): ComponentRef<C>
}

这种方法适用于所有结构指令，如

*ngIf

和

*ngFor

，因为它们都是包装

ng模板的。例如，对于
*ngIf
代码：

<div *ngIf="data">{{name}}</div>

创建组件
它用于使用创建视图。当您在模块的
bootstrap
属性中指定一个组件时，Angular编译器会创建该组件，因此编译器会为其生成一个工厂。使用此方法创建的视图称为
hostview

import { VERSION, Component, ViewChild, TemplateRef, ViewContainerRef } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `
      <ng-container #vc></ng-container>
      <ng-template #tpl>
          <h1>Hello, {{name}}</h1>
      </ng-template>
  `,
  styles: ['']
})
export class AppComponent {
  name = `Angular! v${VERSION.full}`;

  @ViewChild('tpl', {read: TemplateRef}) tpl: TemplateRef<any>;
  @ViewChild('vc', {read: ViewContainerRef}) vc: ViewContainerRef;

  ngOnInit() {
    this.vc.createEmbeddedView(this.tpl);
  }
}

import { Component, ViewContainerRef, ComponentFactoryResolver, NgZone, VERSION, ViewChild } from '@angular/core';

@Component({
  selector: 'hello',
  template: `<h1>Hello Component!</h1>`,
  styles: [``]
})
export class HelloComponent  {}

@Component({
  selector: 'my-app',
  template: `
      <ng-container #vc></ng-container>
  `,
  styles: ['']
})
export class AppComponent {

  @ViewChild('vc', {read:ViewContainerRef}) vc: ViewContainerRef;

  constructor(private resolver: ComponentFactoryResolver) {}

  ngOnInit() {
    const factory = this.resolver.resolveComponentFactory(HelloComponent);
    this.vc.createComponent(factory);
  }
}

import{Component，ViewContainerRef，ComponentFactoryResolver，NgZone，VERSION，ViewChild}来自'@angular/core'；
@组成部分({
选择器：“你好”，
模板：`Hello Component！`，
样式：[``]
})
导出类HelloComponent{}
@组成部分({
选择器：“我的应用程序”，
模板：`
`,
样式：['']
})
导出类AppComponent{
@ViewChild（'vc'，{read:ViewContainerRef}）vc:ViewContainerRef；
构造函数（专用冲突解决程序：ComponentFactoryResolver）{}
恩戈尼尼特（）{
const factory=this.resolver.resolveComponentFactory（HelloComponent）；
this.vc.createComponent（工厂）；
}
}


要了解主机视图和嵌入式视图之间的区别，请阅读
谢谢@AngularInDepth.com的回复。我按照您的链接找到了“主机视图和嵌入式视图”之间的区别，现在我的理解是嵌入式视图适合创建动态表示视图。但是，对于一个智能组件来说，createComponent是一个不错的选择，它的功能远不止显示数据。我说的对吗？@Blaze，不客气。嗯，我想这是一种看待它的方式。由于嵌入式视图是从
ng template
创建的，并且没有与组件相关联的类，因此
嵌入式视图中没有多少逻辑。然而，我想说的是，大多数嵌入式视图用于可重用的表示。所有结构指令都使用
ng模板
。我将在回答一个问题时添加这一点，在调用ViewContainerRef#createComponent后，我可以确保该组件必须在DOM中吗？@Chao，一旦该方法返回，它就在DOM中。我认为自上次更新此答案以来，深度角度已经改变@MaxKoretskyi您可以将URL更新为：
@Directive({selector: '[ngIf]'})
export class NgIf {
    private _updateView() {
       ...
       if (this._thenTemplateRef) {
           this._thenViewRef =
               this._viewContainer.createEmbeddedView(this._thenTemplateRef, this._context);

import { Component, ViewContainerRef, ComponentFactoryResolver, NgZone, VERSION, ViewChild } from '@angular/core';

@Component({
  selector: 'hello',
  template: `<h1>Hello Component!</h1>`,
  styles: [``]
})
export class HelloComponent  {}

@Component({
  selector: 'my-app',
  template: `
      <ng-container #vc></ng-container>
  `,
  styles: ['']
})
export class AppComponent {

  @ViewChild('vc', {read:ViewContainerRef}) vc: ViewContainerRef;

  constructor(private resolver: ComponentFactoryResolver) {}

  ngOnInit() {
    const factory = this.resolver.resolveComponentFactory(HelloComponent);
    this.vc.createComponent(factory);
  }
}