Question

用户需要在文本区域上使用输入键，但不能在formGroup中使用。

这里是我的 html

<form [formGroup]="interventionForm" (ngSubmit)="onSubmit()" (keydown.enter)="$event.preventDefault()">

    <textarea class="focus-input gap-textarea"></textarea>

<button type="submit" class="btn teq-btn">{{ lang.trans('send') }}</button>

</form>

formGroup 不能通过按 enter键提交，但是 textareas 会受到影响。

Answer 1

您需要使用$ event.stopPropagation（）而不是$ event.preventDefault（）。您的代码应如下所示：

<form [formGroup]="interventionForm" (ngSubmit)="onSubmit()" (keydown.enter)="$event.stopPropagation()">

    <textarea class="focus-input gap-textarea"></textarea>

<button type="submit" class="btn teq-btn">{{ lang.trans('send') }}</button>

</form>

Answer 2

我认为这回答了您的问题，但也适用于遇到此问题的其他人，如果您希望 keydown.enter 在 textarea 中工作但不想在其他地方提交表单，以下对我有用:

<form (keydown.enter)="$event.preventDefault()">
  <textarea (keydown.enter)="$event.stopPropagation()"></textarea>
  <button type="submit">Submit</button>
</form>

这会阻止 keydown.enter 提交表单：
<form (keydown.enter)="$event.preventDefault()">

这允许 enter 仍然在 textarea 中创建新行：
<textarea (keydown.enter)="$event.stopPropagation()">

旁白：按下回车键时提交的表单只是存在提交按钮时的默认行为：
<button type="submit">Submit</button>
可能您一开始就不需要/不想要它，因此您可以将其更改为 type="button"。

角度-允许在文本区域上输入Enter键，但不在formGroup中

2 个答案: