如何在Angular组件中动态访问或渲染子组件？

<ng-container #container></ng-container>

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

export class ParentComponent {
  @ViewChild('container', { read: ViewContainerRef }) container: ViewContainerRef;

  constructor(private componentFactoryResolver: ComponentFactoryResolver) { }
}

import { ChildComponent } from './child.component';

export class ParentComponent {
  // ...

  loadChildComponent() {
    const childComponentFactory = this.componentFactoryResolver.resolveComponentFactory(ChildComponent);
    const childComponentRef = this.container.createComponent(childComponentFactory);
    // 可以通过childComponentRef来访问或操作子组件
  }
}

export class ParentComponent {
  // ...

  loadChildComponent() {
    // ...

    const childComponentInstance = childComponentRef.instance;
    childComponentInstance.someMethod();
    console.log(childComponentInstance.someProperty);
  }
}