Angular 5：将数组从子组件传递到父组件

Question

我有一个孩子和一个父组件。

我想从子组件传递一个数组并将其显示在父组件中。

我首先开始：

@Input data: string[];

然后在ngOnInit我有：

ngOnInit() {
   this.data = ['name1', 'name2', 'name3'];
}

然后我有父组件：

<app.parent></app.parent>

我的问题是：如何在父组件中显示此数据？

Answer 1

您应该使用@Output()，如下所示

@Output() data: EventEmitter<string[]> = new EventEmitter<string[]>();

ngOnInit() {
   this.data.emit(['name1', 'name2', 'name3']);
}

您应该在父母处理

事件

<app.parent (data)="eventHandler($event)"></app.parent>

eventHandler(event:string[]){
     this.childData = event;
}

将组件中的childData显示为

{{childData}}