角度9：从ElementRef

Question

我有适用于该表格的指令。它假定将所有组件MyFormWrapper都获取到此表单中，并且在表单上commit（）应为每个调用方法activate（）。由于指令没有视图，因此无法使用@ViewChildren和@ContentChildren。

我的计划是扫描DOM树并获取<my-form-element>的ElementRefs。这部分很容易。我现在缺少的是如何将ElementRef转换为MyFormWrapper组件实例。知道如何解决这个问题吗？

Answer 1

我认为您想将ElementRef升级为ComponentRef。

我认为此代码是您需要的：

// constructor services
private readonly renderer: Renderer2,
private readonly resolver: ComponentFactoryResolver,
private readonly injector: Injector,
private readonly app: ApplicationRef

// Generation
const factorySpinner: ComponentFactory<MatSpinner> = this.resolver.resolveComponentFactory(MatSpinner);
const refSpinner: ComponentRef<MatSpinner> = factorySpinner.create(this.injector);
this.app.attachView(refSpinner.hostView);
refSpinner.instance.color = "accent";
refSpinner.instance.diameter = 24;
const elSpinner: ElementRef<MatSpinner> = refSpinner.location;
const oSpinner: MatSpinner = elSpinner.nativeElement;