сброс реактивной формы запускает все необходимые валидаторы в Angular 6 - PullRequest
0 голосов
/ 15 октября 2018

Я новичок в angular 6, здесь я пытаюсь сбросить форму после отправки данных.

Все работает нормально, но когда я сбрасываю форму после успешной отправки данных в базу данных, запускаются все необходимые валидаторыв форме.

Я пробовал много способов решить эту проблему, но я не мог ее решить.

Здесь после каждой отправки формы я хочу сбросить форму и все валидаторы довведите данные в поля формы для другого представления.

app.component.html

<form [formGroup]="newMemberForm" (submit)="CreateMember(newMemberForm.value)" novalidate>
....
....
</form>

app.component.ts

            this.newMemberForm = this.formBuilder.group({
                  M_Number: ['', [Validators.required]],
                  F_Number: ['', [Validators.required]],
                  M_Name: ['', [Validators.required, Validators.minLength(4)]],
                  M_Status: ['', [Validators.required]],
                  M_Dob: ['', [Validators.required]],
                  M_Sex: ['', [Validators.required]],

                });

       CreateMember(memberForm) { 
        this.dmlService.CreateNewMember(memberForm).subscribe(data => {
              if (data[0]['RESPONSE'] == 'TRUE') 
         {
         this.newMemberForm.reset();
        }
       });
}

Здесь у меня естьсбросьте форму, которая вызывает требуемую validatord. Если я очищаю все валидаторы внутри вышеупомянутой функции, когда я ввожу другие данные формы, валидации не работают.

Здесь я хочу сбросить все валидатор и форму после каждогоотправка формы, и я хочу отправить следующий набор данных формы.

Может кто-нибудь помочь мне решить эту проблему.

Ответы [ 2 ]

0 голосов
/ 30 апреля 2019

Это отличное решение, но у реактивных форм есть своя особенность.

Вы можете удалить проверки в определенной форме formGroup / formcontrol, используя clearValidators () для реактивных форм.

this.formGroup.clearValidators() or      
 this.formGroup.controls.controlName.clearValidators()

После этого вам нужно обновить элемент управления формы с помощью удаленного валидатора

this.formGroup.controls.controlName.updateValueAndValidity()

Это помогло мне решить ту же проблему, надеюсь, оно вам тоже поможет

0 голосов
/ 15 октября 2018

Вам необходимо выполнить сброс, как показано ниже:

В вашем html:

<form [formGroup]="newMemberForm" #formDirective="ngForm"  
(submit)="CreateMember(newMemberForm.value,formDirective)" novalidate>

В дюймах:

CreateMember(value,formDirective:FormGroupDirective){
 ...
 formDirective.resetForm();
 this.myForm.reset();
}

Материал проверяет действительность FormGroupDirective а не FormGroup, следовательно, сброс FormGroup не сбрасывает FormGroupDirective.

Здесь также сообщается о проблеме: https://github.com/angular/material2/issues/9347

...