Angular Firestore Проверка уникального имени (Reactive Forms)

Question

Я новичок в Angular.Я настроил проект с FireStore.Все работает нормально.Теперь я хочу регистрировать только тех пользователей, которые не имеют аккаунта у нас, и сообщать об ошибках тем, кто уже зарегистрирован.Вот register.component.ts

this.form = this.fb.group({
    firstName: new FormControl('',[
      Validators.required,
      Validators.minLength(3)
    ]),
    lastName: new FormControl('',[
      Validators.required,
      Validators.minLength(3)
    ]),
    email: new FormControl('',[
      Validators.required,
      Validators.email,
      CustomValidators.shouldBeUnique(this.afs)
    ])
});

А вот Пользовательский валидатор ShouldBeUnique (afs) .

static shouldBeUnique(afs: AngularFirestore): ValidationErrors | null{
    let emailExists: boolean;
    return (control: AbstractControl) => {
        let emailVal = ''
        let email = control.get('email').value;

        let collref = afs.collection('users').ref;
        let queryref = collref.where('email', '==', email);

        queryref.get().then((snapShot) => {
        if (snapShot.empty) {
            // this.status = 'valid';
            console.log('Email is avalible.');
            return null;
        }
        else {
            console.log('Email is already registered.');
                return { shouldBeUnique: true };
            }
        });
    }
  }

Кодработает нормально и возвращает ноль , если электронная почта отсутствует в БД.Но проблема с кодом в том, что, когда электронная почта существует в БД, она печатает только сообщение в консоли и не возвращает {shouldBeUnique: true}; .Мы будем благодарны за любую помощь.

Answer 1

Ваша проблема здесь:

queryref.get().then((snapShot) => {
    if (snapShot.empty) {
        // this.status = 'valid';
        console.log('Email is avalible.');
        return null;
    }
    else {
        console.log('Email is already registered.');
            return { shouldBeUnique: true };
        }
    });

Вы пытаетесь использовать возврат внутри функции then, но это асинхронное выполнение, и ваш код не будет ждать его завершения.Вот почему console.log работает, а оператор return - нет.

Я предлагаю вам использовать асинхронный / ожидающий подход, чтобы уменьшить сложность, и дайте мне знать, могу ли я вам чем-нибудь помочь.