其中，这个originalEvent来自Angular 2+中使用EventEmitter

Question

也许我的google fu很弱，因为我还没有找到任何关于这方面的信息，但我想尝试澄清一下Angular 2+组件中EventEmitters的行为。考虑以下代码：

my-chart-1.component.html

<div *ngFor="let node of nodes">
<div [id]="node.id" (click)="onNodeClick(node)">
{{node.content}}
</div>
</div>

my-第1部分组件.ts

@Output() nodeClick = new EventEmitter();
onNodeClick(nodeData: any): void {
this.nodeClick.emit(nodeData);
}

my-chart-2.component.html

<div *ngFor="let node of nodes">
<div [id]="node.id" (click)="onNodeClick($event)">
{{node.content}}
</div>
</div>

my-chart-2.component.ts

@Output() nodeClick = new EventEmitter();
onNodeClick(event: any): void {
this.nodeClick.emit(this.currentNode);
}

home.component.html

<my-chart-1 (nodeClick)="onNodeClick($event)"></my-chart-1>
<my-chart-2 (nodeClick)="onNodeClick($event)"></my-chart-2>

home.component.ts

onNodeClick(event: any): void {
console.log(event)
}

以下是这两个nodeClicks的输出：

my-chart-1

{originalEvent: MouseEvent, node: {nodeData}}

my-chart-2

{nodeData}

在调用eventEmitter.emit函数的函数中捕获originalEvent是否是originalEvents没有自动添加到发出的数据中的原因？还是这里发生了其他我不明白的事情？原始事件来自哪里？？

Answer 1

当我回答自己的堆叠式问题时，我总是感到尴尬。这种情况每年至少发生在我身上3次，我讨厌每一次。这通常是因为我忽略了一些愚蠢的东西，所以我向斯塔克弗洛社区介绍它的最初情况总是以某种方式发生了变化，当我回来为子孙后代纠正它时，我表现出了我是一个巨大的傻瓜。这个例子也不例外。

为了子孙后代，我使用了一个名为Priming的库，特别是Priming的组织结构图模块。在我的组织结构图上，我有一个在点击节点时调用的函数。我还在每个特定节点的模板上添加了一个点击事件函数，这并不是因为我点击的位置巧合而被调用的。图表模板看起来像这样：

<p-organizationChart ... (onNodeSelect)="onNodeClick($event)" ... >
<ng-template let-node >
<div (click)="onNodeClick(node)">
{{node.contents}}
</div>
</ng-template>
</p-organizationChart>

正如你所看到的，我在p-organizationChart上调用与在内部div上调用相同的函数作为事件的结果，但因为我从未单击过内部div，所以当我在函数中console.log我的结果时，我只看到了一个事件。"$事件"；从p-organizationChart传递的包括原始事件和实际节点数据，所以这就是我的输出中原始事件的来源。但我看到了单个节点的模板，认为其中包含了某种黑魔法。没有。只有我，一个愚蠢的人。谢谢你抽出时间。