Question

在任何人说什么之前我都知道混合Jquery和Angular2不是最好的做法。但是，我有一个依赖于Jquery的布局管理器（golden-layout）。一旦创建了各个图块，我想将一个由图表/表格组成的Angular 2组件附加到图块。

所以我可以轻松地通过API获取容器，但它来自jquery选择。如何将其转换为ViewContainerRef，以便我可以将组件附加到它。

Answer 1

  export class ComponentService {
    constructor(private componentFactoryResolver: 
        ComponentFactoryResolver,
          private appRef: ApplicationRef,
          private injector: Injector) {
   }

   create(component){
     // get factory and create component
     let factory = this.componentFactoryResolver.resolveComponentFactory(component);
    let ref = confirmDialogFactory.create(this.injector);

    // set input prop
    ref.instance.prop ='ABC';

    // attach to dom
    document.querySelector('body')
          .appendChild(ref.location.nativeElement);

      // run change detection
     this.appRef.attachView(ref.hostView);
    ...
  }

将Angular 2组件附加到特定DOM

1 个答案: