Question

我有一个应用程序，因为我能够获取数组格式的数据。所以我想将数组值绑定到相应的formcontrolname。谁能帮我进行下去。

HTML：

 <div formArrayName="InformationSource">
          <div class="col-sm-12 no-padd inline-block" *ngFor="let itemrow of emrMedicationdetailsForm.get('InformationSource').controls;let i = index;" [formGroupName]="i">
            <div class="col-sm-12 no-padd inline-block">
            <div class="col-sm-4 pull-left m-b10 m-t10">
              <label class="col-sm-5 pull-left col-form-label g-color-gray-dark-v2 text-sm-left no-padd">Date Time</label>
              <div class="col-sm-7 pull-left no-padd">
                <p-calendar formControlName="Date" [monthNavigator]="true" [yearNavigator]="true" yearRange="1910:2020" showButtonBar="true"
                  dateFormat="mm-dd-yy" placeholder="mm-dd-yyyy" [showIcon]="true"></p-calendar>
              </div>
            </div>
            <div class="col-sm-4 pull-left m-b10 m-t10">
              <label class="col-sm-5 pull-left col-form-label g-color-gray-dark-v2 text-sm-left no-padd">Period</label>
              <div class="col-sm-7 pull-left no-padd">
                <input type="text" formControlName="Note1" maxlength="50" placeholder="Period">
              </div>
            </div>
            <div class="col-sm-4 pull-left m-b10 m-t10">
                <a class="col-sm-2 pull-left m-b10 m-t10 delbtn" *ngIf="emrMedicationdetailsForm.get('InformationSource').controls.length >1" (click)="deleteDetails(i)">
                  <i class="fa fa-trash trash"></i>
                </a>
            </div>
          </div>
          </div>
        </div>

TS：

 private medicationFormInit() {
    //Add
    if (!this.medicationDetails) {
      this.emrMedicationdetailsForm = this.FB.group({
        InformationSource: this.FB.array([]),
      });
      this.periodNote.controls = [];
    } else {
        // edit
        InformationSource: this.medicationDetails.data.InformationSource,
      });

      for (let lang of JSON.parse(this.medicationDetails.data.InformationSource)) {
        let group = this.createMedicationInformation();
        group.get('Date').setValue(lang.Date);
        group.get('Note1').setValue(lang.Note1);
      }
    }
  }

private createMedicationInformation() {
    return this.FB.group({
      Date: [''],
      Note1: [''],
    });
  }

  public get periodNote(): FormArray {
    return <FormArray>this.emrMedicationdetailsForm.controls['InformationSource'];
  }

  addDatePeriod(): void {
    this.periodNote.push(this.createMedicationInformation());
  }

  public preventCommunicationEmpty() {
    if (!this.periodNote.length) {
      let group = this.createMedicationInformation();
      group.reset();
      this.datePeriodForm.setControl('InformationSource', this.FB.array([group]));
    }
  }

控制台：

[{"Date":"2018-10-15T18:30:00.000Z","Note1":"34"},{"Date":"2018-10-29T18:30:00.000Z","Note1":"67"}]

因此，我正在通过这种方式从后端获取信息源的控制台数据，因此任何人都可以帮助我进一步发展，我确实在这里感到震惊。

Answer 1

您可以将代码放在stackblitz上吗？看起来有点乱

如何使用angular2中的primeng在单击编辑按钮上的各个字段中分配值

1 个答案: