web-dev-qa-db-ja.com

Angular 2 Reactive Forms vs Template Forms

新しいAngular 2プロジェクトを開始しており、Reactive FormsまたはTemplate Formsのどちらを使用するかを検討しています。ここを読んでいる背景: https://angular.io/guide/reactive-forms

私の知る限り、Reactive Formsの最大の利点は同期的であるということですが、単純なフォームがあり、非同期性が問題を引き起こすとは思いません。 Reactiveのオーバーヘッドははるかに多く、表面上は同じことを行うためのコードが増えているようです。

シンプルなテンプレートフォームよりもReactiveを使用するような、しっかりしたユースケースを誰かが提供できますか?

15
bwobbones

Template-driven vs Reactive Forms

これは、Pluralsightのフォームに関する私のコースのスライドです。これらの点のいくつかは議論の余地があるかもしれませんが、このリストをまとめるためにFormsを開発したAngularチームの人と協力しました。

56
DeborahK

テンプレート駆動設計の利点は、そのシンプルさです。コントローラーにはあまりコードはありません。ほとんどのロジックはテンプレート内で発生します。これは、htmlコードの背後に多くのロジックを必要としない単純なフォームに適しています。

ただし、各フォームにはさまざまな対話によって更新できる状態があり、その状態を管理して破損を防ぐのはアプリケーション開発者の責任です。これは、非常に大きなフォームでは実行が難しくなり、バグが発生する可能性があります。

一方、より多くのロジックが必要な場合、多くの場合、テストも必要です。次に、リアクティブモデル駆動型の設計はさらに多くを提供します。フォーム検証ロジックを単体テストできます。クラスをインスタンス化し、フォームコントロールにいくつかの値を設定し、テストを実行することでそれを行うことができます。複雑なソフトウェアの場合、これは設計と保守性のために絶対に必要です。リアクティブモデル駆動型設計の欠点は、その複雑さです。

両方の設計タイプを混在させる方法もありますが、それは両方のタイプの欠点を抱えています。

これは、両方の方法の簡単なサンプルコードで説明されています: Introduction to Angular Forms-Template Driven vs Model Driven or Reactive Forms

3
Bert Verhees