离子验证阵列表格

时间:2018-09-19 11:30:41

标签: ionic-framework

我具有动态生成的以下表单,我正在尝试进行验证但失败了 错误:ExpressionChangedAfterItHasBeenCheckedError:检查表达式后,表达式已更改。先前的值:'model:sdaDAd'。当前值:“型号:”。

HTML

               <div [formGroup]="someForm">
            <ion-item-group *ngFor="let att of day; let idx = index">
     <ion-item >
         <ion-label color="primary">{{att.label}}{{idx+1}}. Day</ion- 
                label>
        <ion-input formControlName="day" type="text"  text-right  
         [(ngModel)]="day[idx].value"></ion-input>

      </ion-item>
      <ion-item >
    <ion-label color="primary">{{att.label}}{{idx+1}}. Exc</ion-label>
    <ion-input type="text" formControlName="exc"  text-right  
  [(ngModel)]="exc[idx].value"></ion-input>

</ion-item>
<ion-item >
    <ion-label color="primary">{{att.label}}{{idx+1}}. 
  Hint/Repeats</ion-label>
    <ion-input type="text" formControlName="hint" text-right  
[(ngModel)]="hint[idx].value"></ion-input>
</ion-item> 
<span color=danger float-right ion-button icon-left clear 
*ngIf="exc.length > 0"
    (click)="removeInputField(idx)"><ion-icon name="close"></ion-icon>
  Remove
 </span>
 </ion-item-group>


   <ion-card *ngIf="data_exc">
  <ion-item *ngFor="let att of exc; let i=index">
  <div class="card-title">Exc: {{att.value}}</div>
  <div class="card-title">Hint/Repeats: {{hint[i].value}}</div>
  <div class="card-title">Day: {{day[i].value}}</div>

  </ion-item>
  <div class="card-title">Notes: {{workoutData.notes}}</div>

  </ion-card> 

  <button ion-button   (click)="Add()">+Add</button>
  <button ion-button   (click)="goTo()" >Preview</button> <br>
  <ion-toolbar>
  <ion-item>
  <ion-textarea placeholder="Tap here to enter a new note" 
 [(ngModel)]="workoutData.notes" formControlName="notes" 
 autocomplete="on" autocorrect="on"></ion-textarea>
</ion-item>
</ion-toolbar>
 <button [disabled]="!someForm.valid" ion-button full 
 (click)="presentConfirmCustomWorkout()" type="submit" >Submit</button>
</div>

检查表单是否为空的验证,这样我就不会在数组中得到空值

this.someForm = formbuilder.group({
  'day': [this.day.value, Validators.compose([Validators.required])],
  'exc': [this.exc.value, Validators.compose([Validators.required])],
  'hint': [this.hint.value, Validators.compose([Validators.required])],
  'notes': ['', Validators.compose([Validators.required])],


});

0 个答案:

没有答案