Подождите ответа объекта в Angular 9 - PullRequest
Новая
       29

Подождите ответа объекта в Angular 9

1 голос
/ 27 марта 2020

Я впервые пишу здесь, поэтому сначала прошу прощения, если я делаю что-то не так.

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

У меня есть эта функция в моем сервисе: 

 validateDDBB(userName, teamName, email: string) {
    let requestUrl: string = '/api/tenniship/validator/user?userName=' + userName + '&teamName=' + teamName + '&email=' + email;
    const config = { headers: new HttpHeaders().set('Content-Type', 'application/json') };
    return this.http.get<Array<boolean>>(requestUrl, config);
  }

Я хочу ее для формы регистрации. Я хочу знать, если электронная почта, имя пользователя и имя команды уже зарегистрированы в моей базе данных. Эта функция отправляет мне логический массив размера = 3, который указывает, являются ли они уже или нет.

Проблема в том, что выполняющийся код не ожидает ответа, поэтому полученные результаты используют данные мусора.

Функция моего компонента: 

databaseValidator(){
    this.loginService.validateDDBB(this.username, this.teamName, this.email).subscribe(
      res => {
        this.usedUsername = res[0].valueOf();
        this.usedTeamName = res[1].valueOf();
        this.usedEmail = res[2].valueOf();
        console.log("Data base info pulled: " + res);
        return true;
      },
    error => {
      console.error("Something went wrong: undefined: " + error);
      return false;
    }
    );
  }

Как я могу изменить свой код, например, когда я это сделаю, мой код будет ждать ответа, чтобы я не использовал данные мусора? 

onSubmit(){
    this.databaseValidator();
    //usedUsername, usedTeamName and usedMail are primitive boolean variables.
    console.log("Username: " + this.usedUsername);
    console.log("Team: " + this.usedTeamName);
    console.log("email: " + this.usedEmail);
}

Спасибо большое!

1 Ответ

1 голос
/ 27 марта 2020

databaseValidator метод будет немедленно, затем сообщения консоли будут распечатаны, а loginService будет скомпилирован, есть некоторые варианты решения вашей проблемы, например, передача callback , возврат наблюдаемое или обещание

таким образом вы можете сделать это, вернув обещание 

databaseValidator() : Promise<any> {
   return new Promise((resolve, reject) => {
    this.loginService.validateDDBB(this.username, this.teamName, this.email).subscribe(
      res => {
        this.usedUsername = res[0].valueOf();
        this.usedTeamName = res[1].valueOf();
        this.usedEmail = res[2].valueOf();
        console.log("Data base info pulled: " + res);
        resolve()
      },
    error => {
      console.error("Something went wrong: undefined: " + error);
      reject()
    }
    );
  }

onSubmit(){
    this.databaseValidator().then(()=>{

    console.log("Username: " + this.usedUsername);
    console.log("Team: " + this.usedTeamName);
    console.log("email: " + this.usedEmail);
    })  
}

, потому что databaseValidator возвращает обещание, которое мы можем используйте async / await 

async onSubmit(){
    await this.databaseValidator();

    console.log("Username: " + this.usedUsername);
    console.log("Team: " + this.usedTeamName);
    console.log("email: " + this.usedEmail); 
}
...