Как обмениваться данными между родительским и угловым модулем, загружаемым динамически через Systemjs - PullRequest
Новая
       83

Как обмениваться данными между родительским и угловым модулем, загружаемым динамически через Systemjs

0 голосов
/ 26 апреля 2019

Я загружаю модуль Angular динамически в родительское приложение, используя следующий код: 

@Component({
  selector: 'app-dynamic-pack',
  template: '<ng-container #vc ></ng-container>',
  styleUrls: ['./dynamic-pack.component.scss']
})
export class DynamicPackComponent implements OnInit {
  @ViewChild('vc', { read: ViewContainerRef }) vc: ViewContainerRef;
  constructor(public compiler: Compiler, private injector: Injector, private sysplexesService: SysplexesService) { }

  ngOnInit() {
    this.loadRemoteModule();
  }

  loadRemoteModule() {
    const remoteModule = this.sysplexesService.getRemoteModule();

    // These library are already present, so no need to reload them.
    SystemJS.set('@angular/core', SystemJS.newModule(AngularCore));
    SystemJS.set('@angular/common', SystemJS.newModule(AngularCommon));
    SystemJS.set('@angular/material', SystemJS.newModule(AngularMaterial));
    SystemJS.set('@angular/router', SystemJS.newModule(AngularRouter));
    SystemJS.set('d3', SystemJS.newModule(d3));
    SystemJS.set('@angular/common/http', SystemJS.newModule(HttpClientModule));
    SystemJS.set('moment', SystemJS.newModule(moment));

    SystemJS.import(remoteModule.url).then((module) => {
      this.compiler.compileModuleAndAllComponentsAsync(module[`${remoteModule.name}Module`])
        .then((moduleFactory) => {
          const moduleRef = moduleFactory.ngModuleFactory.create(this.injector);
          const factory = moduleFactory.componentFactories.find(
            item => item.componentType.name === `${remoteModule.name}Component`);

          if (factory) {
            const component = this.vc.createComponent(factory);
            const instance = component.instance;
          }
        });
    });
  }
}

Мой вопрос заключается в том, как лучше всего передать некоторые данные динамически загружаемому компоненту (#vc)?

Должен ли я попытаться создать общий модуль, содержащий службу, которую я объявил как peerDependencies в моем удаленном модуле?

...