Question

我正在尝试按回车键按下登录表单上的按钮。但事实并非如此。代码如下：

<div>
  <button type="button" mat-raised-button (click)="doLogin()" (keyup.enter)="doLogin()">
    Sign In
  </button>
</div>

我不知道它为什么不开火。控制台和角度文档中没有错误表明它没有任何特殊要求。

Answer 1

如果控件位于表单中，则按下 Enter 时将触发ngSubmit事件。要通过单击按钮触发事件，您应删除属性type="button"。当按钮处于表单中时，默认类型为type="submit"。

<form (ngSubmit)="onNgSubmit()">
  <div>
    <input type="text" name="username" placeholder="User name" />
    <button mat-raised-button>Sign In</button>
  </div>    
</form>

export class UserFormComponent {
  onNgSubmit() {
    // Proceed with login...
  }
}

您可以在this stackblitz中测试代码。

Answer 2

您正在尝试 button 上的键盘，按钮没有该事件，而是您应该尝试 input 表单

<form >
  <input type="text" (keyup.enter)="doLogin()" />
</form

修改

如果你想在提交使用时被解雇

<form (ngSubmit)="doLogin()">

Answer 3

试试这个。这对我来说很好。希望它有所帮助！

<form>
  <input type="text" (keyup.enter) = "doLogin($event)">
</form>

在组件：

中

doLogin(e){
 console.log(e);
}

角度2材料keyup.enter根本不发射

3 个答案: