Адрес электронной почты не найден при проверке базы данных в Angular 6

Я выполняю проверку адреса электронной почты для обязательного поля и недействительного адреса электронной почты. Я хочу выполнить проверку «если электронная почта не найдена в базе данных» после нажатия кнопки «Отправить», тогда должно появиться сообщение об ошибке, например, я показываю требуемый и шаблон. Ниже приведен код: я использую дизайн материала Angular 6.

             <form [formGroup]='loginForm' id="loginForm">       
             <mat-form-field>
              <mat-label>Email Address</mat-label>             
              <input matInput placeholder="" formControlName="emailid" required>
              <mat-error *ngIf="formControl.emailid.errors && (formControl.emailid.dirty || formControl.emailid.touched)">
                <p *ngIf="formControl.emailid.errors.required">Email is required</p>
                <p *ngIf="formControl.emailid.errors.pattern">Invalid email address</p>

              </mat-error>
              </mat-form-field>
              <button mat-button type="submit" (click)="login()">Login</button>
               </form>

Ниже идентификатор кода для ts файла.

               loginForm: FormGroup;
               emailId: any;
               status: any;

               ngOnInit(){
                this.loginForm = this.formBuilder.group({
                  emailid: ['', [Validators.required, Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')]]
                });
               }

                get formControl() { return this.loginForm.controls; }

                 login() {
                    this.emailId = this.loginForm.controls['emailid'].value;
                        this.service.get({{ email: this.emailId}, 'url').subscribe((response) => {
                           this.result = response;
                              this.status = this.result.status;
                              if (this.status === 200) {
                                               //navigate to home page
                            } else If(this.status === 404) {
                                console.log("email not found");
                                // here i want to show this message like aboove i am showing for required and pattern field.
                            }
                     });

как только отображается сообщение, затем после выполнения возврата в поле ввода электронной почты сообщение об ошибке должно исчезнуть. И как отобразить сообщение «электронное письмо не найдено», если его нет в базе данных. Может ли кто-нибудь помочь мне, как этого добиться.


person ananya    schedule 24.04.2019    source источник
comment
проверьте эту ссылку @ananya npmjs.com/package/angular-notifier   -  person kashif    schedule 24.04.2019


Ответы (2)


пожалуйста, попробуйте это

this.loginForm.controls['email'].setErrors({'incorrect': true});
person Kelvin KCS    schedule 24.04.2019

В вашем html добавьте обработчик событий в поле ввода, чтобы проверить, является ли это backspace и resetForm, который удалит ошибки в форме.

В HTML:

<input matInput placeholder="" formControlName="emailid" (keypress)="ResetForm($event)" required>

После тега <mat-error>:

<p *ngIf="isEmailPresent">Email Address Not found</p>

В вашем ts-файле инициализируйте isEmailPresent=false, а в другой части, где вы получаете 404, this.isEmailPresent=true;

В ts-файле: убедитесь, что вы импортировали ниже

import { Component, ViewChild } from '@angular/core';
import {
  FormGroup,
  FormBuilder,
  FormGroupDirective,
  Validators,
} from '@angular/forms';

Добавить formdirective как viewchild:

 @ViewChild(FormGroupDirective) formGroupDirective: FormGroupDirective;

В форме сброса keypressevent

ResetForm(event)
{
  if(event && event.keycode==8)//(keycode for backspace)
    {
       this.formGroupDirective.resetForm();
     }
}
person Ashok    schedule 24.04.2019
comment
Хорошо, @Ashok, я попробую. Но моя актуальная проблема заключается в том, как отобразить сообщение об ошибке, если адрес электронной почты не найден в базе данных. В другой части, где я проверяю, имеет ли статус 404, должно отображаться сообщение об ошибке, например, адрес электронной почты не найден. Вы можете мне помочь, как это сделать? - person ananya; 24.04.2019
comment
Отображение сообщения об ошибке сработало. Но функция Backspace не сработала. Я сделал это с помощью (keyup) во вводе. Если длина поля ввода равна 0, то я изменяю isEmailPresent на false. @Ashok - person ananya; 25.04.2019