angular - 来自 @HostListener 的 event.preventDefault() 用于表单元素

Question

我有一个组件可以侦听submit主机组件中的表单事件。并且表单具有 (ngSubmit) 绑定。我想停止表单提交。但以下不起作用：它命中submit listened然后，也调用submitForm()方法。

@Component({
  selector: 'my-component'
})
export class ComponentClass {

  @HostListener('submit',['$event'])
  public onSubmit(event : Event){
    console.log('submit listened');
    event.preventDefault();
    event.stopPropagation();

  }
}

在主机组件中：

<my-component>
  <form (ngSubmit)="submitForm()">...
  </form>
</my-component>

标签： angulartypescriptdom-events