說明

英文

Note that just as a form group contains a group of controls, the profile form FormGroup is bound to the form element with the FormGroup directive, creating a communication layer between the model and the form containing the inputs. The formControlName input provided by the FormControlName directive binds each individual input to the form control defined in FormGroup. The form controls communicate with their respective elements. They also communicate changes to the form group instance, which provides the source of truth for the model value.

中文(翻譯)

FormGroup 就是 controls 的表單群組，使用 FormGroup directive 綁定到表單元素，建立一層 在 model 和 包含 input 表單之間 的 通訊層，從 FormControlName directive 綁定到個別輸入 的 form control 提供給 FormControlName 輸入框 並 定義進 FormGroup 中。form controls 在各自的 elements 中互相流通，他們也可以改變 form group 實體，從 model value 提供數據的來源

屬性

value
取得還活躍的 AbstractControl (還活躍的 指的是 disabled = false)

controls: {...}
取得有註冊的 AbstractControl 清單

方法

registerControl(name: string, control: AbstractControl): AbstractControl
這個方法不會更新 control 的值或驗證，請使用 addControl 代替

addControl(name: string, control: AbstractControl): void
新增一個 AbstractControl

removeControl(name: string): void
移出不要的 AbstractControl

setControl(name: string, control: AbstractControl): void
替換成新的 AbstractControl (要替換的formControl名稱, {value: '', disabled: true})

contains(controlName: string): boolean
確定 control 是否無法取得，判斷方法：是否處於 disable 狀態

setValue(value: { [key: string]: any; }, options: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
一定要按照架構把參數去對照值

patchValue(value: { [key: string]: any; }, options: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
補丁可以單獨替換需要替換的值 ({value: '', disabled: true})

reset(value: any = {}, options: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
重新設定 FormGroup 並把下層的 AbstractControl 改為 pristine (乾淨的) 和 untouched (未觸碰過的)，將值設定為 null

getRawValue(): any
取得包含 disabled 的 AbstractControl

參考來源

https://angular.io/api/forms/FormGroup