Angular 5 数据在components之间传递（下） 子

子组件通过event向父组件传递信息，比父到子的数据传递要稍微复杂一点。

这里我们有子组件cockpit和父组件app，结构如下：cockpit组件中有两个button和两个输入框，点击button后，会把输入框的值传递到app组件的serverElements arry中。

首先，子组件cockpit中双向绑定数据：

然后进行数据传输：

1，连接父子组件，通过在app 的 html中用标签连接：

这里（serverCreated）是app-cockpit组件的一个事件（event），“onServerAdded($event)”是属于 app组件的一个function，这样就把子组件的事件和父组件的function连接起来了。

2，先写父组件app中的onServerAdded($event) 方法：这里的$event是一个javascript对象

3，然后去实现（serverCreated）事件，这个事件是在子组件cockpit中的 ：

这里有几个注意点： 1，serverCreated这个事件是一个EventEmitter对象，2，在serverCreated对象前要加@Output（）注释，3*，onServerAdded中的变量名要和EventEmitter中泛型的变量名一致（比如都是servername，servercontent）

4，在click button的方法中把这个serverCreated事件发布出去（关联button）：

onAddServer（）方法是在html中于click绑定的。