Подтвердить что ты не робот

Angular2 отправить форму, нажав enter без кнопки отправки

Можно ли отправить форму, которая не имеет кнопки отправки (нажав клавишу ввода) Пример:

<form [ngFormModel]="xxx" (ngSubmit)="xxxx()">
  <input [(ngModel)]="lxxR"   ngControl="xxxxx"/>
</form
4b9b3361

Ответ 1

возможно, вы добавите keypress или keydown в поля ввода и назначьте событие функции, которая будет выполнять отправку при нажатии кнопки

ваш шаблон будет выглядеть следующим образом

<form (keydown)="keyDownFunction($event)">
  <input type="text" />
</form

И вы будете функционировать внутри вашего класса, будет выглядеть так:

keyDownFunction(event) {
  if(event.keyCode == 13) {
    alert('you just clicked enter');
    // rest of your code
  }
}

Ответ 2

Вы также можете добавить (keyup.enter)="xxxx()"

Ответ 3

Edit:

  <form (submit)="submit()" >
    <input />
    <button type="submit" style="display:none">hidden submit</button>
  </form>

Чтобы использовать этот метод, вам нужно иметь кнопку отправки, даже если она не отображается "Спасибо за Ответ Toolkit"

живой пример

Старый ответ:

Да, точно так же, как вы его написали, кроме имени события (submit) вместо (ngSubmit):

<form [ngFormModel]="xxx" (submit)="xxxx()">
  <input [(ngModel)]="lxxR"   ngControl="xxxxx"/>
</form>

Забастовкa >

Ответ 4

Я предпочитаю (keydown.enter)="mySubmit()", потому что не будет добавлен разрыв строки, если курсор находился где-то внутри <textarea>, но не в конце.

Ответ 5

<form [formGroup]="form" (keyup.enter)="yourMethod(form.value)">

</form>

Ответ 6

добавление невидимой кнопки отправки делает трюк

<input type="submit" style="display: none;">

Ответ 7

Надеюсь, это может помочь кому-то: по какой-то причине я не мог отслеживать из-за нехватки времени, если у вас есть такая форма, как:

<form (ngSubmit)="doSubmit($event)">
  <button (click)="clearForm()">Clear</button>
  <button type="submit">Submit</button>
</form>

когда вы нажмете кнопку Enter, вызывается функция clearForm, хотя ожидаемое поведение состояло в вызове функции doSubmit. Изменение кнопки Clear на тег <a> решило проблему для меня. Я все равно хотел бы знать, ожидаем это или нет. Кажется, меня смущает

Ответ 8

Просто добавьте (keyup.enter)="yourFunction()"