Angular2-将值传递给使用ComponentFactory创建的动态组件 [英] Angular2 - Pass values to a dynamic component created with ComponentFactory

问题描述

我在上遵循了GünterZöchbauer的建议.如何创建动态组件 而且我想知道如何将值传递给它-例如，子组件具有@input.

I was following Günter Zöchbauer's advice on how to create dynamic components and I was wondering how I could pass values to it - as in, the child component has an @input.

使用上述问题中提供的插栓示例-插栓-如何通过子组件是一个字符串，我们称其为消息，然后单击添加"按钮时将显示该消息.

Using the plunker example given in the above question - plunker - how could I pass the child component a string, lets call it message, that would then display when clicking the 'add' button.

以下是子组件的外观示例:

Here's an example of how the child component might look:

import {Component OnChanges, Input} from '@angular/core'

    @Component({
      selector: 'hello',
      providers: [],
      template: `<h1>{{message}}</h1>`,
      directives: []
    })
    export class HelloComponent implements OnChanges {
      @Input() message:any;

      constructor() {
      }

      ngOnChanges(changes:any){
      }
    }

推荐答案

您可以在下面尝试

  let instance  = this.viewContainerRef.createComponent(this.componentFactory, 0).instance;
  instance.message = "some text!!";

这是柱塞！

希望这会有所帮助！

这篇关于Angular2-将值传递给使用ComponentFactory创建的动态组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！