Question

我试图以角度5反应形式捕获FormArray控件的valueChanges事件。我有正常的表单组valueChanges事件和相同的工作正常但不适用于formArray控件。

我已将表单组定义为 -

this.ApplicationForm = this.fb.group({
  ApplicationPenalties: this.fb.array([this.preparePenaltyDetails()])
});

并初始化表单数组，如下所示 -

preparePenaltyDetails(): FormGroup {
    return this.fb.group({
      Id: '',
      ApplicationId: '',
      RevisionNo: '',
      PenaltyMwh: ''
    });
  }

当我从api获取数据时，我将控件设置为 -

this.ApplicationForm.setControl('ApplicationPenalties', this.fb.array(this.application.ApplicationPenalties
              .map(x => this.fb.group(x)) || []));

我的html模板如下 -

<div formArrayName="ApplicationPenalties" *ngFor="let penalty of ApplicationPenalties.controls; let i=index">
                    <div [formGroupName]="i">
                      <div class="row pocCharges">
                        <div class="col-md-6">
                          <div class="form-group">
                            <h4 class="d-sm-block">Revision Number</h4>
                            <div class="input-group">
                              <input class="form-control form-control-sm" formControlName="RevisionNo" type="text">
                              <span class="input-group-addon">
                                <i class="material-icons">account_box</i>
                              </span>
                            </div>
                          </div>
                        </div>
                        <div class="col-md-6">
                          <div class="form-group">
                            <h4 class="d-sm-block">Penalty(MWh)</h4>
                            <div class="input-group">
                              <input class="form-control form-control-sm" formControlName="PenaltyMwh" type="number">
                              <span class="input-group-addon">
                                <i class="fa fa-bolt fa-2x"></i>
                              </span>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>

然后在ngOnInit中，我试图捕获valueChanges事件 -

(<FormArray>this.ApplicationForm.get('ApplicationPenalties')).controls.forEach(
      control => {
        control.get('PenaltyMwh').valueChanges
        .debounceTime(100)
        .distinctUntilChanged()
        .subscribe(value => console.log(value));
      }
    );

但它永远不会被触发。我也尝试将valueChanges代码段放在我的formArray初始化中，但没有运气，

valueAharay控件的valueChanges不会触发

0 个答案: