Angular 4 动态组件加载和发送数据到父组件

Angular 4 Dynamic component loading & emitting data to parent component

我正在使用自定义组件为动态表单生成创建 poc。

我在某种程度上取得了成功,我可以根据 json 数组使用一组动态组件创建表单。现在我被困在一个例子中,我只需要从这些组件中获取输出或者更确切地说是用户更新相关输入的数据。

我查看了@output 装饰器和 eventEmitter,但我无法从中找到合适的解决方案。非常感谢社区中的任何人能给我提个醒 :)

请关注PLUNKER查看当前进度和我的做法

你走对了,这里有两种方法可以使用

(i) 服务

(ii) 使用 eventEmitter - 输出装饰器

由于组件是动态的,您可以随时订阅并且服务可以将数据发送回 app.ts。

为了得到一个想法,看看这个

在您的示例中,我修改了服务 addDynamic 组件方法并向每个组件添加了输出事件,这将属于 app.ts

DEMO