kątowa 2 zapobiec wejść od złożenia w formie szablonu napędzany

Question

mam formy, które używa szablonu napędzany plan, więc coś takiego:

<form #myForm="ngForm" ngSubmit="save(myForm.value, myForm.isValid)"> 
    <input #name="ngModel" [(ngModel)]="name"> 
    <button type="submit">Submit form</button> 
</form> 

Teraz, w jaki sposób można zapobiec ENTER ze złożeniem formularza? Koliduje to z niestandardowym zachowaniem ENTER wewnątrz formularza, a także jeśli przypadkowo wciśnij enter na wejściu, które jest niechciane.

Rozejrzałem się i znalazłem kilka starych odpowiedzi Angular 1, a także niektóre standardowe JavaScript, ale uważam, że Angular 2 musi mieć coś takiego, ale już nie jestem w stanie go znaleźć.

Jeśli nie, jaki byłby najlepszy sposób, aby to osiągnąć?

Answer 1

Okazuje się, że można użyć coś tak prostego jak:

<form (keydown.enter)="$event.preventDefault()"></form> 

Aby zapobiec formularz ze złożeniem na ENTER.

Answer 2

Aby umożliwić wprowadzenie klucza do pracy w pola tekstowe, ale uniemożliwić złożenie formularza, można zmodyfikować w następujący sposób:

W szablonie HTML:

<form (keydown.enter)="handleEnterKeyPress($event)">...</form> 

w klasie komponentu w kodzie .TS za:

handleEnterKeyPress(event) { 
    const tagName = event.target.tagName.toLowerCase(); 
    if (tagName !== 'textarea') { 
     return false; 
    } 
    } 

Answer 3

wiem, że jestem późno, ale może mam prawidłowe rozwiązanie tego problemu,

jeśli używasz wtedy wystarczy zdefiniować

<button type="button"> 

raczej nie definiując go lub definiując go jako type = „submit” bo jeśli nie definiują go będzie złożyć formularz.

samo, jeśli używasz wtedy również zdefiniować

<input type="button"> 

i to będzie działać.