event.preventDefault ？ event.preventDefault() : event.returnValue = false;不能在 Firefox 中工作答案

【问题标题】：event.preventDefault ? event.preventDefault() : event.returnValue = false; not working in firefoxevent.preventDefault ？ event.preventDefault() : event.returnValue = false;不能在 Firefox 中工作
【发布时间】：2018-08-10 08:42:42
【问题描述】：

我正在使用 angular 并且我有组件 c-button 我有以下代码：

  @HostListener('click', ['$event'], ) preventDefault(): void {

      event.preventDefault ? event.preventDefault() : event.returnValue = false; //event.preventDefault support for IE
      event.stopPropagation();
  }

在父组件中我有以下代码：

  <c-button class="button-search" (click)="search()"> SEARCH </c-button>

点击按钮时出错：

ERROR ReferenceError: "事件未定义"

我没有根据我的代码在互联网上找到解决方案来解决这个问题。

我无法将 $event 传递给搜索函数，因为我必须从组件类中调用此函数。那么如何定义事件呢？

需要帮助。

【问题讨论】：

标签： angular firefox event-handling dom-events

【解决方案1】：

preventDefault 方法需要有一个 Event 参数才能在方法中引用。

@HostListener('click', ['$event']) preventDefault(event: Event): void {
    event.preventDefault ? event.preventDefault(): event.returnValue = false;
    event.stopPropagation();

【讨论】：

感谢您提供此解决方案。它现在正在工作。我试图将它传递给 HostListner。我实际上不明白 @HostListener('click, ['$event']) preventDefault(event: Event) 语法。 preventDefault() 看起来像函数定义，但 @Hostlistner ('click', ['$event']) 与 preventDefault() 结合使用，我无法理解。我更熟悉这种语法： $("#selectot").on("event", function(e){ });或 document.getElementById('selector').addEventListener("event", function(event) { });... 谢谢！！ :)
HostListener 实际上只是您已经拥有的（单击）语法。第一个参数是它应该监听的事件，第二个参数是传递给函数的参数。所以@HostListener('click', ['$event]) preventDefault(event)语法可以翻译成(click)="preventDefault($event)。