Javascript 验证反应式表单元素的总和

我有一个反应形式，基本上就是这样

ngOnInit() {

    this.myForm = this.fb.group({
      sections: this.fb.array([])
    });
  }

  addSection(){
    let section = <FormArray>this.myForm.controls.sections;
    section.push(this.fb.group({
      name: '',
      items: this.fb.array([]),
      percentage: '',
    }));
  }

ngOnInit（）{
this.myForm=this.fb.group({
节：this.fb.array（[]）
});
}
addSection（）{
让section=this.myForm.controls.sections；
部分。推送（this.fb.group({
名称：“”，
项目：this.fb.array（[]），
百分比：“”，
}));
}

addSection（）是一个函数，当我单击模板上的某个内容时，它会将一个元素添加到我的

节阵列中

我总结了数组中

部分中每个
部分的所有百分比，并验证其不大于1（我假设用户在这些特定输入中键入浮点）。最后，如果总和大于1，我想禁用表单末尾的submit按钮

我尝试了这个问题的答案，但没有成功，因为
https://stackoverflow.com/a/48706808/8579973
因为它是指一组相同的对象。我需要它来验证每个组中的“百分比”元素

我还尝试将总和存储在本地存储器中，但我不希望有任何额外的按钮触发该过程

谢谢你的回答，
像这样看待
堆栈闪电战：

像这样堆栈闪电战：

谢谢你的回答，但那不是我需要的。百分比是用户决定的百分比。例如，如果用户创建了4个部分，他可以为每个部分分配0.25（25%），结果将是100%。我只需要验证用户创建的每个部分的控件<代码>百分比的总和是否大于1我想这就是我的答案所显示的-一个自定义验证器，它将验证所有百分比字段的总和。
addSection（）
是您必须了解的部分。我刚刚做了多个
部分。为了演示目的推送
。天才，这解决了我的问题。。。起初我没有得到那些
部分。按
。非常感谢你！很高兴我能帮忙：）谢谢你的回答，但那不是我需要的。百分比是用户决定的百分比。例如，如果用户创建了4个部分，他可以为每个部分分配0.25（25%），结果将是100%。我只需要验证用户创建的每个部分的控件<代码>百分比的总和是否大于1我想这就是我的答案所显示的-一个自定义验证器，它将验证所有百分比字段的总和。
addSection（）
是您必须了解的部分。我刚刚做了多个
部分。为了演示目的推送
。天才，这解决了我的问题。。。起初我没有得到那些
部分。按
。非常感谢你！很高兴我能帮忙：）
import { Component} from '@angular/core';
import {FormBuilder, FormControl, FormArray, FormGroup, FormGroupDirective, NgForm, ValidatorFn, Validators} from '@angular/forms';


@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent{
  myForm: FormGroup;
  constructor(private fb: FormBuilder){
    this.myForm = this.fb.group({
      sections: this.fb.array([], CustomValidator.checkPercentageSum)
    });
    this.addSection();
  }

  addSection(){
    let section = this.myForm.get('sections') as FormArray;
    section.push(this.fb.group({
      percentage: 0.2,
    }));
    section.push(this.fb.group({
      percentage: 0.3,
    }));
    section.push(this.fb.group({
      percentage: 1,
    }));

    console.log(this.myForm.valid , this.myForm.get('sections').errors);
    // Output: false {Invalid: true}
  }

}

//Custom Validator
export class CustomValidator {
  static checkPercentageSum(sections: FormArray): ValidationResult {
    if (sections) {
      let sumOfPercentages: number = 0;
      sections['controls'].forEach((sectionItem: FormGroup) => {
        sumOfPercentages = sectionItem['controls'].percentage.value + sumOfPercentages;
      });

      if (sumOfPercentages > 1) {
        return {"Invalid": true};
      }
    }
    return null;
  }
}

export interface ValidationResult {
  [key: string]: boolean;
}