div情况下Angular6（点击）未通过事件

Question

我正在关注： https://coursetro.com/posts/code/59/Angular-4-Event-Binding

我的代码如下：我在按钮的位置使用了div：

<div (click)="updateSelectedLanguage($event)">
    <!-- More items -->
</div>

然后：

  updateSelectedLanguage(event : any) {
    console.log(event);
  }

但是，事件始终是未定义的。我在这里想念什么？

Answer 1

在这种情况下，模板中的$event保留变量将有关单击的事件信息（位置，目标等）传递给控制器​​。但是，您正在传入模板item，但它似乎未定义。因此，在控制器中，您将看到undefined。然后，您应该传递定义的内容，例如：

<div (click)="updateSelectedLanguage('es')">
    <!-- More items -->
</div>
<div (click)="updateSelectedLanguage('en')">
    <!-- More items -->
</div>

或者也许您想获取事件的目标（被点击的div）？

<div (click)="updateSelectedLanguage($event)">
    <!-- More items -->
</div>

updateSelectedLanguage(event : any) {
   console.log(event.target);
}

编辑作者的主要文章版本：

然后您的代码有其他问题。在这里，您有一个说明您的代码段运行正常的示例：https://stackblitz.com/edit/angular-dxmcsh

Answer 2

在给定的示例中，其标记是一个按钮，因此当传递$ event时，将传递按钮click事件。按钮具有预定义的结构，该结构将成为该事件的一部分。

在您的情况下，您将其附加到div，div没有预定义的结构，您必须将其与数据一起提供给它们，例如ngModel或ngForm结构。

Answer 3

您通过的项目是什么？是否需要传递一些变量。如果要在单击HTML的函数中传递事件参数，则需要传递$ event。