Problem on validation in form array in angular-CodePudding

I have a problem on validation in form array. I have a assignment for validate the sum of subQuota(formarray) should be equal to total quota. The validation is correct when the page is ngOnInit (subquota : 13,3,4 && totalquota: 20). However, when user want to click "assign more quota", he add one more "2" subquota (subquota : 13,3,4,2 && totalquota: 20), the error message will show immediately. When user noted that he is incorrect for total quota, he adjusted the total quota as "22" (subquota : 13,3,4,2 && totalquota: 22). The message still show again althought the validation is correct. It seem to be not update the validation. What problem on it ? Here is code

CodePudding user response：

1., Change the inputs' type from 'text' to 'number' in order to have e.g.: 4 (number) and not '4' (string) as the input value. You can't do 20 '4', but 20 4 is a valid operation.

<input type="number" formControlName="subQuota">
<input type="number" formControlName="totalQuota">

2., Change the default value from '' to 0 or null in addNewAssignQuota() function in order to not have invalid input values at all, even if it is only the default value.

  control.push(
    this.fb.group({
      subQuota: [0],
    })