[Angular] 強制使FormGroup的表單驗證啟動方式



用法:

this.Service.FormGroup.setErrors({invalid:true})


 // 設定表單送出的那層formGroupd卡關
      this.formDataService.serviceFormGroup
        .get('FundsList')
        .setErrors({ invalid: true });


stockoverflow上類似寫法
formData.form.controls['email'].setErrors({'incorrect': true});


使用時機:

因為有時formgroup有階層
或是結構是formgroup包array

下面這範例就是FundsList和SecurtiesList都各自有包其他內容

 createForm() {
    this.serviceFormGroup = this.fb.group({     
      ApplicantDate: [''],    
      FundsList: this.fb.array([]),
      SecuritiesList: this.fb.array([]),
      ApplicantReason: [''],
    });
  }

  getFundsListForm() {
    return this.fb.group({
      StockBusinessType: [''],
      StockCode: ['', [Validators.required]],
      StockName: [''],
      NumberOfApplications: [
        '',
        [Validators.required, Validators.max(500), Validators.min(1)],
      ],
      StockLimitUpPrice: [''],
      ApplicationAmount: [''],
    });
  }

  getSecuritiesListForm() {
    return this.fb.group({
      StockBusinessType: [''],
      StockCode: ['', [Validators.required]],
      StockName: [''],
      NumberOfApplications: [
        '',
        [Validators.required, Validators.max(500), Validators.min(1)],
      ],
    });
  }


所以底下驗證雖然有成功

但是最外面的結構驗證無法啟動
於是要靠強制設定才能讓表單在送出前被驗證卡下

















留言

這個網誌中的熱門文章

[Angular] 閒置登出作法

[JavaScript] 將array object 根據值重新 js format的作法