Question

我有不同的组件（父/子和兄弟姐妹）。我想要的是在不同地方创建动态组件的共享方法。换句话说，我想访问其他组件方法来调用它们并创建动态组件。

我了解共享服务但由于此错误而无法创建组件：Cannot read property 'resolveComponentFactory' of undefined

这就是我所取得的成就。这很好。

first.component.ts

import { secondComponent } from './secondComponent';
import { testComponent } from './testComponent';

@component({
  template: `<div #target></div>`
})

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

compInstance:any;
ngOnInit(){
  let factory = this.cfr.resolveComponentFactory(secondComponent);
  this.compInstance = this.target.createComponent(factory);

  //this is how I pass loadComponent method to component
  this.compInstance.instance.firstComponentMethod = this;
}

//this is shared method
loadComponent(){
  this.target.clear();
  let factory = this.cfr.resolveComponentFactory(testComponent);
  this.target.createComponent(factory);
}

second.component.ts

import { firstComponent } from './firstComponent';

@Input() firstComponentMethod:firstComponent;

ngOnInit(){

  //this method loads 'testComponent' component 
  this.firstComponentMethod.loadComponent();
}

但是正如您所看到的那样，我只在this关键字的帮助下将当前的组件方法传递给组件实例 - ＆gt; this.compInstance.instance.firstComponentMethod = this;我也想传递其他组件方法，但不知道如何。也找不到另一种方法来解决我的问题。 所以任何帮助都将受到赞赏

Angular2通过调用组件方法在不同的地方创建动态组件

0 个答案: