web-dev-qa-db-de.com

Was sind die praktischen Unterschiede zwischen vorlagengesteuerten und reaktiven Formen?

Ich habe über die Angular2-API für neue Formulare gelesen und es scheint, dass es zwei Ansätze für Formulare gibt, einer für vorlagengesteuerte Formulare, der andere für reaktive oder modellgesteuerte Formulare.

Ich würde gerne den praktischen Unterschied zwischen den beiden kennen, nicht den Unterschied in der Syntax (offensichtlich), sondern den praktischen Nutzen, und welcher Ansatz in verschiedenen Szenarien mehr Vorteile bringt. Auch gibt es einen Leistungsgewinn bei der Auswahl eines über dem anderen? Und wenn ja, warum?

123
gdyrrahitis

Vorlagengesteuerte Formularfunktionen

  • Einfach zu verwenden
  • Geeignet für einfache Szenarien und nicht für komplexe Szenarien
  • Ähnlich wie AngularJS
  • Bidirektionale Datenbindung (unter Verwendung der [(NgModel)] -Syntax)
  • Minimaler Komponentencode
  • Automatische Verfolgung des Formulars und seiner Daten (von Angular verarbeitet)
  • Unit Testing ist eine weitere Herausforderung

Funktionen für reaktive Formulare

  • Flexibler, braucht aber viel Übung
  • Bewältigt alle komplexen Szenarien
  • Es wird keine Datenbindung durchgeführt (unveränderliches Datenmodell von den meisten Entwicklern bevorzugt)
  • Mehr Komponentencode und weniger HTML-Markup
  • Es können reaktive Transformationen ermöglicht werden wie
    • Behandeln eines Ereignisses basierend auf einer Entprellzeit
    • Behandeln von Ereignissen, bei denen die Komponenten bis zur Änderung unterschiedlich sind
    • Elemente dynamisch hinzufügen
  • Einfacheres Testen von Einheiten
137
Aravind

Ich denke, es ist eine Diskussion über Code , Strategie und Benutzererfahrung .

Zusammenfassend ändern wir für Template-gesteuerten Ansatz, der einfacher zu arbeiten ist damit zu reaktiv (im modellgetriebenen Ansatz), um uns mehr Kontrolle zu geben , was zu einer besser überprüfbaren Form führt, indem eine Entkopplung zwischen HTML (das Design/CSS-Team kann hier arbeiten) und den Geschäftsregeln der Komponente (winklige/js spezialisierte Mitglieder) und wirksam wird. Verbessern Sie die Benutzererfahrung mit Funktionen wie reaktiven Transformationen, korrelierten Validierungen und behandeln Sie komplexe Szenarien als Laufzeitvalidierungsregeln und dynamische Felder Vervielfältigung.

Dieser Artikel ist eine gute Referenz: Angular 2 Forms - Template Driven und Model Driven Approaches

20
Richard Lee

Hier ist die Zusammenfassung des Vergleichs zwischen vorlagengesteuerten und reaktiven Formen, die von DeborahK (Deborah Kurata) gut erklärt wurde, enter image description here

14

Reaktive Formen:

  • wiederverwendbar,
  • robuster,
  • prüfbar,
  • skalierbarer

Vorlagengesteuerte Formulare:

  • einfach hinzuzufügen,
  • weniger skalierbar,
  • grundanforderungen an die Form

In Zusammenfassungen Wenn Formulare für Ihre App sehr wichtig sind oder reaktive Muster in Ihrer App verwendet werden, sollten Sie reaktive Formulare verwenden und einfache Voraussetzung für Formulare wie Anmelden, sollten Sie template-driven Formulare.

Es gibt einen offiziellen Link angular

0
fgul