訪問FormControl元素，而不是直接使用form.get

Question

考慮下面的代碼片段一個FormGroup內：

<input type="email" class="form-control form-control-lg" formControlName="email" placeholder="email">

反正是有，我可以在模板中使用此輸入的值（不從。 ts文件）使用參考變量（例如），而不是使用form.get('email')...，會有什麼好處嗎？

Answer 1

你可以在你的component文件中創建一個參考：

group: FormGroup; 
emailCtrl: FormControl; 
// other controls 

ngOnInit() { 
    this.emailCtrl = this.formBuilder.control(
    '', 
    [ 
     Validators.required, 
     Validators.email 
    ]); 

    this.group = this.formBuilder.group({ 
    email: this.emailCtrl 
    // other controls 
    }); 
} 

所以，在模板：

<form novalidate [formGroup]="group"> 
    <input type="email" placeholder="email" [formControl]="emailCtrl"> 
    email value = {{emailCtrl.value}} 
</form> 

DEMO