小编Chr*_*lar的帖子

我创建了单击以动态加载组件视图,但我每次单击都是单独的.我想有函数,我通过函数传递一个字符串,而不是在我的函数中输入该字符串来加载视图.

这是一个工作的plunker http://plnkr.co/edit/ZXsIWykqKZi5r75VMtw2?p=preview

零件

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Lets dynamically create some components!</h2>
      <button (click)="createHelloWorldComponent()">Create Hello World</button>
      <button (click)="createWorldHelloComponent()">Create World Hello</button>
      <dynamic-component [componentData]="componentData"></dynamic-component>
    </div>
  `,
})

export class App {
  componentData = null;

  createHelloWorldComponent(){

    this.componentData = {
      component: HelloWorldComponent,
      inputs: {
        showNum: 9
      }
    };
  }

  createWorldHelloComponent(){
    this.componentData = {
      component: WorldHelloComponent,
      inputs: {
        showNum: 2
      }
    };
  }
}

想要的是一个函数,并从数组中定义一个在(click)中传递并加载视图的变量. 这是一个尝试的plunker: http ://plnkr.co/edit/HRKGhCCEfkOhNjXbr6C5？p = preview

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Lets dynamically create some components!</h2>

          <li …