Benny
Benny

Reputation: 164

asynchronous behavior of functions in typescript

I implemented this snippet of code:

var tmpString = null;
    this.restProvider.validateUser(this.registerCredentials.email, this.registerCredentials.password)
      .then(data => {
        tmpString = JSON.stringify(data);
      });
    console.log(tmpString);

But, despite data is not null, console print a null value and tmpString is set to the right value after a short time. How I can solve that problem? Thanks

The real function is:

registerNewUser()
  {
    var tmpString = null;
    this.restProvider.validateUser(this.registerCredentials.email, this.registerCredentials.password)
      .then(data => {
        tmpString = JSON.stringify(data);
      });
    console.log(tmpString);
    if(tmpString == "false")
    {
      return false;
    }
    else
    {
      this.registerCredentials.email = JSON.parse(tmpString).email;
      this.registerCredentials.password = JSON.parse(tmpString).password;
      this.email = JSON.parse(tmpString).email;
      this.password = JSON.parse(tmpString).password;
    }
    return this.email + this.password;
  }

and I use it

public login() {
    this.showLoading();
    this.registerNewUser();

    if(this.email == "false" && this.password == "false")
    {
      this.showError("Access Denied");
    }
    else
    {
      this.auth.login(this.registerCredentials);
      this.showError("Access Permit");

    }
}

I resolved doing that

registerNewUser()
  {
    var tmpString = null;
    this.restProvider.validateUser(this.registerCredentials.email, this.registerCredentials.password)
      .then(data => {
        tmpString = JSON.stringify(data);
        if(tmpString == "false")
        {
          this.showError("Access Denied");
        }
        else
        {
          this.registerCredentials.email = JSON.parse(tmpString).email;
          this.registerCredentials.password = JSON.parse(tmpString).password;
          this.email = JSON.parse(tmpString).email;
          this.password = JSON.parse(tmpString).password;

          this.auth.login(this.registerCredentials);
          this.showError("Access Permit");
        }
      });

  }

But is this the right solution?

Upvotes: 1

Views: 61

Answers (1)

lealceldeiro
lealceldeiro

Reputation: 14958

Taking into account the below code (commented with line numbers):

var tmpString = null; // 1
this.restProvider.validateUser(this.registerCredentials.email, this.registerCredentials.password)
  .then(data => {
    tmpString = JSON.stringify(data); // 2
  });
console.log(tmpString); // 3

The order of execution is:

  1. line 1
  2. line 3
  3. line 2

That's because when line 3 is reached, the asynchronous request hasn't finished. So in order to print tmpString properly, move the console.log(tmpString); after line 2, inside the callback (when the response arrived), like this:

var tmpString = null; // 1
this.restProvider.validateUser(this.registerCredentials.email, this.registerCredentials.password)
  .then(data => {
    tmpString = JSON.stringify(data); // 2
    console.log(tmpString); // 3
  });

Upvotes: 3

Related Questions