угловая 6 реактивная форма, показывающая ошибку мат после сброса формы - PullRequest
Новая
       10

угловая 6 реактивная форма, показывающая ошибку мат после сброса формы

0 голосов
/ 05 января 2019

Моя угловая динамическая реактивная форма, показывающая сообщение об ошибке мат после формы сброса. 

  <form *ngIf="formGroup" [formGroup]="formGroup" class="form">
  <div  fxLayout="column" *ngFor="let field of fields;let i=index;" 
         [ngSwitch]="field.type">
   <mat-form-field *ngSwitchCase="'text'">
      <input matInput [placeholder]="field.label" 
  [formControlName]="field.name" [id]="field.name">
      <mat-error>{{field.error}}</mat-error>
    </mat-form-field>

 <mat-form-field *ngSwitchCase="'dropdown'">
  <mat-select placeholder="{{field.label}}" [formControlName]="field.name" 
(selectionChange)="onDropDownChange($event)">
    <mat-option  *ngFor="let item of field.items" [value]="item">
      {{item.fact}}
    </mat-option>
  </mat-select>
  </mat-form-field>
 <button (click)="add(formGroup)">
    ADD
  </button>

dynamicform.component.ts 

 export class dynamicFormComponent implements OnInit {
  formGroup: FormGroup;
   fields;
  ngOnInit() {
 this.formGroup = this.createFormControls();
  this.fields = [{
 {
    name:"categoryname",
    error:"Please Select ",
    label:"Category",
    type: "text", 
    validation: Validators.required

 },{  name:"categoryType",
    error:"Please Select ",
    label:"Category Type",
    type: "dropdown", 
    items: ['cat1','cat2'],
    validation: Validators.required
  }]
 }

 createControlForm() {
 let fm = {};
 this.fields.forEach((f) => {
 fm[f.name] = new FormControl('', 
  f.validation);
 });
 }

   submit(model){
   // submit logic
    this.formGroup.reset();
    }
    }

После отправки формы я снова сбрасываю форму. Сбрасывается, но отображается сообщение об ошибке. Я пробовал много способов ниже, вот некоторые из них. 

    submit(model) {
    // Submit logic
     this.formGroup.reset();
     this.formGroup.markAsUntouched();
     this.formGroup.markAsPristine();
      }

2) Добавлено @ViewChild ('formDirective') formDirective: NgForm; 

   submit(model) {
   // Submit logic
  this.formDirective.resetForm();
  this.formGroup.markAsUntouched();
  this.formGroup.markAsPristine();
   }

Я не знаю, чего мне здесь не хватает. Я не могу понять это. Пожалуйста, помогите мне

...