子动态创建的组件与父组件之间的Angular4通信
Posted
技术标签:
【中文标题】子动态创建的组件与父组件之间的Angular4通信【英文标题】:Angular4 communication between child dynamically created component to parent 【发布时间】:2018-01-15 03:04:33 【问题描述】:我有一个 Angular4 组件,只要用户按下加号按钮,它就会动态创建许多子组件。子组件有一个输入选择,必须在选项选择后向父组件发送信息。
ComponentFactoryResolver 正在创建子组件,如下所示
let componentFactory = this.componentFactoryResolver.resolveComponentFactory(MyComponent);
let viewContainerRef = this.anchor.viewContainerRef;
viewContainerRef.createComponent(componentFactory);
子组件有一个使用 EventEmitter 的输出,但是当应用程序运行时没有任何反应。
我尝试过不使用动态创建并且工作正常。
我搜索了很多示例,但没有一个考虑 angular4 或父级与动态创建的子级之间的通信。
【问题讨论】:
您能否为您的问题创建一个 plunker 示例。找到解决方案会很有帮助 【参考方案1】:试试这个:
let componentFactory = this.componentFactoryResolver.resolveComponentFactory(MyComponent);
let viewContainerRef = this.anchor.viewContainerRef;
const dynamicComponentInstance = viewContainerRef.createComponent(componentFactory).instance;
dynamicComponentInstance['childEventEmitter'].subscribe((eventEmitter) =>
console.log(eventEmitter)
);
childEventEmitter
是您从子组件发出的变量名。
【讨论】:
以上是关于子动态创建的组件与父组件之间的Angular4通信的主要内容,如果未能解决你的问题,请参考以下文章