表單開發模型
說明
- 兩種表單開發模型
- 範本為主的表單開發模式(Template-Driven Form)
- 要匯入 FormsModule
- 用宣告的方式建立表單
- 使用ngModel指令
- 在範本中宣告驗證規則
- 只能對表單進行E2E測試
- 模型為主的表單開發模式(Model-Driven Form)
- 要匯入 ReactiveFormsModule
- 用編程的方式建立表單
- 使用formControlName屬性
- 在元件中宣告驗證規則
- 可以對表單進行單元測試
- 可動態增減欄位
- 較方便使用自訂的欄位驗證元件
- 範本為主的表單開發模式(Template-Driven Form)
- 同一個
<form>
tag區塊中不能混用兩種開發模型 - 同一個component中不同的
<form>
tag可以用不同的開發模型