Angular.js: ngSubmit löst die Formularübermittlung bei jeder Schaltfläche ohne type="button" aus

Ich denke, dies ist in den Dokumenten erklärt, obwohl nicht erwähnt wird, dass Sie die Übermittlung durch puttint type="button" verhindern können:

Wenn ein Formular ein oder mehrere Eingabefelder und eine oder mehrere Schaltflächen oder input[type=submit] hat, dann löst das Drücken der Eingabetaste in einem der Eingabefelder den Click-Handler auf der ersten Schaltfläche aus oder input type=submit und einen Submit-Handler auf dem beiliegendes Formular (ngSubmit)

Ich habe nur Stunden damit verschwendet...

ng-submit sollte nur für Schaltflächen mit explizit gesetztem type="submit" ausgelöst werden.

so funktioniert html nicht?

Oh, das ist also nur die Art und Weise, wie HTML-Formulare standardmäßig jede Schaltfläche als Senden-Schaltfläche behandeln. Ich frage mich, warum type="submit" dann existieren muss?

Wie auch immer.. Ich werde sicherstellen, dass alle Schaltflächen type="button" hinzugefügt werden, es sei denn, es handelt sich um eine Schaltfläche zum Senden.

@soichih - ja, du hast recht. ngSubmit reagiert nur auf das Submit-Ereignis und der Browser ist dafür verantwortlich, dies auszulösen.

Es gibt tatsächlich eine Reihe von Szenarien, in denen dies eintreten kann.

Um eine doppelte Ausführung des Handlers zu verhindern, verwenden Sie nur eine der Anweisungen ngSubmit oder ngClick. Dies liegt an den folgenden Regeln für die Formularübermittlung in der HTML-Spezifikation:

• Wenn ein Formular nur ein Eingabefeld hat, löst das Drücken der Eingabetaste in diesem Feld das Senden des Formulars aus (ngSubmit).
• Wenn ein Formular mehr als 2 Eingabefelder und keine Schaltflächen oder Eingabe[type=submit] hat, dann löst das Drücken der Eingabetaste nicht das Senden aus
• Wenn ein Formular ein oder mehrere Eingabefelder und eine oder mehrere Schaltflächen oder input[type=submit] hat, dann löst das Drücken der Eingabetaste in einem der Eingabefelder den Click-Handler auf der ersten Schaltfläche aus oder input type=submit und einen Submit-Handler auf dem beiliegendes Formular (ngSubmit)

Es ist hier dokumentiert: https://docs.angularjs.org/api/ng/directive/form
Wir sollten es entweder duplizieren oder expliziter in den ngSubmit-Dokumenten referenzieren.

@petebacondarwin möchte dafür einen schnellen Patch zusammenstellen?

Ach, dann mach weiter :-)

Vielen Dank für den Hinweis! Das habe ich mit diesem Beitrag vielleicht noch nie herausgefunden! Danke schön! -- Steve

Zu Ihrer Information, dies geschieht auch in Ionic3.... Das Hinzufügen von type="button" zur zweiten Schaltfläche behebt das Problem ebenfalls

danke soichih

Sie müssen vorsichtig sein, denn wenn Sie mehr als eine Schaltfläche haben, auch wenn Sie angegeben haben, dass eine Schaltfläche gesendet wird, wird sie in einer von ihnen gesendet, die nicht den Typ = "Schaltfläche" hat.

Was ist, wenn das Hinzufügen von type="button" keine Lösung ist, weil benutzerdefinierte Schaltflächenkomponenten im Formular verwendet werden?

@moniuch , wie in der Dokumentation erklärt, erfolgt dies durch den Browser, nicht durch AngularJS. Es ist Standard-HTML-Verhalten.