Question

我动态创建了组件使用此代码：

   const inputProviders = Object.keys(data.inputs).map(
        (inputName) => {
            return { provide: inputName, useValue: data.inputs[inputName] };
        });

    const resolvedInputs = ReflectiveInjector.resolve(inputProviders);
    // We create an injector out of the data we want to pass down and this components injector
    const injector = ReflectiveInjector.fromResolvedProviders(resolvedInputs, this.dynamicComponentContainer.parentInjector);

    // We create a factory out of the component we want to create
    const factory = this.resolver.resolveComponentFactory(data.component);

    // We create the component using the factory and the injector
    const component = factory.create(injector);

    // We insert the component into the dom container
    this.dynamicComponentContainer.insert(component.hostView);

    // Destroy the previously created component
    if (this.currentComponent) {
        this.currentComponent.destroy();
    }

    this.currentComponent = component;
}
constructor(private resolver: ComponentFactoryResolver) { }

组件名称是ChatComponent，其中包含一个数组消息

但是现在每当有来自服务器的通知时我都会更新我想在消息数组中推送消息。

像这样......“

    export class NotificationHandler {
   constructor( @Inject(forwardRef(() => ChatComponent)) private _chatComponent: ChatComponent) { }

   receiveMessage(chatMessage) {
      console.log('sending message', this._chatComponent.messages);
   this._chatComponent.messages.push(chatMessage);
  }
}

但似乎这是该组件的不同实例，因为消息数组在此未定义，而在UI上我可以看到消息是可见的

如何更新动态创建的Component的模型？

0 个答案: