Model-driven Forms

說明

1. 又稱作Reactive Forms
2. 在元件中設計表單模型與資料模型，同時可給予欄位預設值與驗證規則
3. 使用時須匯入ReactiveFormsModule模組
4. 表單模型最上層一定是FormGroup，必須在template的<form>tag中套用[formGroup]繫結元件中的FormGroup物件
5. 表單模型架構：
   • FormGroup
     • --FormControl
     • --FormGroup
       • --FormControl
     • --FormArray
       • --FormGroup
         • --FormControl
       • --FormControl

重要類別

1. AbstractCoontrol：
   • 下面三個類別都繼承此抽象類別
   • 定義下面三個類別共用的屬性和方法
   • 有一部分屬性是Observable型別
2. FormControl：
   • 用來追蹤某一個表單控制項的欄位值與驗證狀態
3. FormGroup：
   • 用來追蹤某一群表單控制項的欄位值與驗證狀態
   • 以物件方式進行群組
   • 欄位之間沒有順序性，索引為string
   • 有api可以動態增減子控制項
4. FormArray
   • 用來追蹤某一群表單控制項的欄位值與驗證狀態
   • 以陣列方式進行群組
   • 欄位之間有順序性，索引為number
   • 有api可以動態增減子控制項