angular2 presentare il modulo premendo il pulsante Enter

Question

E 'possibile senza presentare a presentare una forma che non ha pulsante di invio (premendo Invio) esempio:

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

Answer 1

forse si aggiunge keypress o keydown ai campi di input e assegnare l'evento alla funzione che eseguirà l'invio quando si fa clic su INVIO

il proprio modello sarebbe simile a questo

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

E si lavora all'interno della vostra classe sarebbe simile a questa

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

Answer 2

Edit:

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

Per poter utilizzare questo metodo, è necessario disporre di un pulsante di invio, anche se non viene visualizzato "Grazie per Toolkit's answer"

live example

Old Risposta:

Sì, esattamente come hai scritto, tranne il nome dell'evento è (submit) invece di (ngSubmit):

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

Answer 3

È inoltre possibile aggiungere (keyup.enter)="xxxx()"

Answer 4

In questo modo è molto semplice ...

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

</form> 

Answer 5

l'aggiunta di un pulsante invisibile presentare fa il trucco

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

Answer 6

preferisco (keydown.enter)="mySubmit()" perché non ci sarà aggiunto un ritorno a capo se il cursore era da qualche parte all'interno di un <textarea> ma non al suo termine.

Answer 7

Speriamo che questo possa aiutare qualcuno: per qualche motivo non ho potuto rintracciare a causa della mancanza di tempo, se si dispone di una forma come:

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

quando si preme il pulsante di Enter, la funzione viene chiamata clearForm , anche se il comportamento previsto era chiamare la funzione doSubmit. La modifica del pulsante Clear su un tag <a> ha risolto il problema per me. Vorrei ancora sapere se è previsto o meno.Sembra confuso per me

Answer 8

Basta semplicemente aggiungere (keyup.enter)="yourFunction()"