ОШИБКА Ошибка: formGroup ожидает экземпляр FormGroup. Пожалуйста, передайте один дюйма с 2 разделами - PullRequest
0 голосов
/ 24 января 2020

Я перепробовал все способы, чтобы решить эту проблему, но эта ошибка происходит постоянно, если я решаю эту проблему для одной формы, вторая форма раздела начинается с той же самой проблемы. Я не могу найти решение, чтобы решить эту проблему, может кто-нибудь помочь мне, пожалуйста. Первые 2 поля этой группы форм не заполнены значениями, и ошибка исходит из последнего поля раздела before другой группы, даже если все поля заполнены и переплетены. Если я прокомментирую значения ошибки, бросая div, то перед предыдущим комментируемым div выбрасывает ошибку. Нужна плохая помощь

HTML первого раздела:

 <div class="row">
          <div class="col-12">
            <div class="form-group">
              <label for="">Note Field</label>
              <textarea class="form-control" placeholder="Note Field" formControlName="note" maxlength="500" autocomplete="note"></textarea>
            </div>
          </div>
        </div>

HTML:

  <form [formGroup]="agentCaptiveInfoForm">
      <div class="card-body" >
        <div class="row">
          <div class="col">
            <div class="form-group">
              <label for="">Agent Number</label>
              <input type="text" class="form-control" placeholder="Captive Agent Code" name="agentNumber"
                formControlName="agentNumber" allowNumberOnly autocomplete="new-agentNumber" maxlength="10">
            </div>
          </div>
          <div class="col">
            <div class="form-group">
              <label for="">County Code</label>
              <input type="text" class="form-control" placeholder="Captive Agent County" name="agentCounty"
                formControlName="agentCounty" autocomplete="new-agentCounty" maxlength="50">
            </div>
          </div>
          <div class="col">
            <div class="form-group">
              <label for="">District</label>
              <input type="text" class="form-control" placeholder="Captive Agent District" name="agentDistrict"
                formControlName="agentDistrict" autocomplete="new-agentDistrict" maxlength="50">  
            </div>
          </div>
          <div class="col">
            <div class="form-group">
              <label for="">Agent Manager</label>
              <input type="text" class="form-control" placeholder="Captive Agent Manager" name="agentManager"
                formControlName="agentManager" autocomplete="new-agentManager" maxlength="50">
            </div>
          </div>
        </div>
      </div>
     </form>

TS:

private captiveInfoFormInit() {
   if (!this.groupCode && !this.agentCode) {
    //  Add
      this.agentCaptiveInfoForm = this.FB.group({
        agentNumber: [''],
        agentCounty: [''],
        agentManager: [''],
        agentDistrict: [''],
      })
    } else {
      // Edit
        if(this.agentDetailsList && this.agentDetailsList.captiveInfo) {
          this.agentCaptiveInfoForm = this.FB.group({
            agentNumber: this.agentDetailsList.captiveInfo.captiveAgentNumber?this.agentDetailsList.captiveInfo.captiveAgentNumber:'',
            agentCounty: this.agentDetailsList.captiveInfo.captiveAgentCounty,
            agentManager: this.agentDetailsList.captiveInfo.captiveAgentManager,
            agentDistrict: this.agentDetailsList.captiveInfo.captiveAgentDistrict
          })
        }
   }
    if (this.mode == 1) {
      this.agentCaptiveInfoForm.disable();
      this.isReadOnly = true;
    }
  }

В демоверсии нет ошибки, потому что я дал значения непосредственно, но в моем приложении this.agentDetailsList получается после попадания API.

DEMO

1 Ответ

0 голосов
/ 25 января 2020

Когда вы сталкиваетесь с этой ошибкой, вы можете добавить ngIf в элемент formGroup, чтобы решить ее

ОШИБКА: formGroup ожидает экземпляр FormGroup. Пожалуйста, введите один.

пример

<div [formGroup]="yourFormGroupName" *ngIf="yourFormGroupName" ></div>
...