angular2/ionic2を使用して送信ボタンを有効/無効にする

Question

私は選択ボックスと入力フィールドを持つフォームを持っています。

this.addAccountForm = fb.group({ 
     'type': ['', Validators.compose([Validators.required])],   
     'beneficiaryvid': ['', Validators.compose([Validators.required])], 
     'actype': ['', Validators.compose([Validators.required])] 
    }); 


    this.type= this.addAccountForm.controls['type']; 
    this.beneficiaryvid= this.addAccountForm.controls['beneficiaryvid']; 
    this.actype= this.addAccountForm.controls['actype']; 

、選択されたi「が必要」は異なるフィールドを表示する必要がある値（空白ではない）

<form [formGroup]="addBeneficiaryForm"> 
     <ion-item [class.error]="!type.valid && type.touched"> 
       <ion-label>Type</ion-label> 
        <ion-select [formControl]="type"> 
        <ion-option value="VPA">VPA</ion-option> 
        <ion-option value="IFSC">ACCOUNT/IFSC</ion-option> 
       </ion-select> 
       </ion-item> 
       <p *ngIf="type.hasError('required') && type.touched" danger>type required</p> 
       <div *ngIf="type.value == 'VPA'"> 
       <ion-item [class.error]="!beneficiaryvid.valid && beneficiaryvid.touched"> 
        <ion-label floating>Virtual Address</ion-label> 
        <ion-input [formControl]="beneficiaryvid" type="text"> 
        </ion-input> 
       </ion-item> 
       <p *ngIf="beneficiaryvid.hasError('required') && beneficiaryvid.touched" danger>Virtual ID is required</p> 
       </div> 

       <div *ngIf="type.value == 'IFSC'"> 
       <ion-item [class.error]="!actype.valid && actype.touched"> 
        <ion-label>Account Type</ion-label>         
       </ion-item> 
       <p *ngIf="actype.hasError('required') && actype.touched" danger>account type is required</p> 
    <div class="btn-top-margin"> 
      <button [disabled]="!addBeneficiaryForm.valid" (click)="addBenificiary(addBeneficiaryForm.value)" large primary block>Add</button> 
      </div> 
</form> 

signup.tsファイルに基づいており、私は一度送信ボタンを有効にしますフォームは有効ですが、ボタンはまだ無効な状態です。

Answer 1

actypeの入力はありません。私はそれが必須フィールドであると考えています。あなたのフォームは常に無効です。テンプレート内に[formControl]の代わりにformControlNameを使用する必要があります。