按enter键提交表单时触发连锁反应

尝试添加 keydown.enter 窗体的事件侦听器,它将触发 button 的波纹:

<form (keydown.enter)="btn.ripple.launch({centered:true})">
  <input>
  <button #btn mat-button>Click me!</button>
</form>

请注意,我补充道 btn 模板引用mat按钮。

如果要触发ts文件中的涟漪:

import {Component, ViewChild} from '@angular/core';
import {MatButton} from '@angular/material';
  .
  .
  .
@ViewChild('btn') btn: MatButton;
  .
  .
  .
ripple() {
  this.btn.ripple.launch({
    centered: true
  });
}

你的HTML应该是:

<form (keydown.enter)="ripple()">
  <input>
  <button #btn mat-button>Click me!</button>
</form>

使用 ngSubmit 而不是 向下键.enter 也可以:

<form (ngSubmit)="ripple()">
  <input>
  <button #btn mat-button>Click me!</button>
</form>

STACKBLITZ