Angular2：我可以用箭头函数而不是方法处理@Output返回值

Question

我有一个Angular2应用，其中有一个父组件（AppComponent）和几个子组件。 其中一个（DnDContainer）具有@Output变量，如下所示：

@Output() onDataUpdate: EventEmitter<any> = new EventEmitter();

在DnDContainer内部，单击事件中包含一个带有以下代码的按钮：

onSave(e) {
   this.onDataUpdate.emit(this.data);
   // this.data is just a simple string array
}

然后，在AppComponent中，有几个DnDContainer组件（它们的选择器是“ dnd-container”）。 我想听听他们的“ onDataUpdate”输出，并将其分配给另一个数组（targetItemsA，targetItemsB等）。 我正在尝试使用这样的简单语法：

<dnd-container (onDataUpdate)="($event) => {targetItemsA = $event}"></dnd-container>
<dnd-container (onDataUpdate)="($event) => {targetItemsB = $event}"></dnd-container>

但这是行不通的，因此我不得不创建一种特定的方法，仅用于将一个数组分配给另一个数组，如下所示：

<dnd-container [onDataUpdate)="update('A', $event)"></dnd-container>
<dnd-container [onDataUpdate)="update('B', $event)"></dnd-container>

该方法如下所示：

update(which, data) {
  switch (which) {
   case 'A':
     this.targetItemsA=data;
     break;
   case 'B':
     this.targetItemsB=data;
     break;
   case 'C':
     this.targetItemsC=data;
     break;
   (ETC...)
  }
}

有没有更简单的方法可以做到这一点（例如我一开始指的带有箭头功能的方法）？ 抱歉，如果太基础了，我对Angular2还是很陌生。

提前致谢，

PS：在tsconfig.spec.json文件上，我已将'target'属性更改为'es6'，但仍然无法使用。

Answer 1

进行以下更改：

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

如果您知道将要发出的类型，请尝试避免使用any类型。

在应用程序组件中，您有两个选择：创建一个函数来处理事件（清除程序模板），或直接在其中进行操作。 显然，您不想创建一个方法，因此以下方法应该起作用：

<dnd-container (onDataUpdate)="targetItemsA = $event"></dnd-container>