javascript - angular2 http在點擊事件下，第一次點選為undefined，第二次才能取得值

Question

angular2 http在點擊事件下，第一次點擊為undefined，第二次才能獲得值,這個是什麼原因，如何實現，每點擊一次，都顯示不同的值？

就例如下面的程式碼中，okLogin()我已經獲得了name和password，我將傳回的data賦值給this.result，然後在點擊事件發生後執行isLogin()，isLogin則會執行okLogin。但我發現，我點擊第一次的時候，result盡然是undefined，點擊第二次的時候可以得到result，但是當result值發生變化後，第一次點擊仍然是列印出了前一個值，並不是目前獲得的值。請問該怎麼解決？

okLogin(){
    this.http.get('http://localhost:3000/api/users/login/'+this.Name+'/'+this.Pwd+'')
      .map(res => res.json())
      .subscribe(
        data => this.result=data,
        err => console.error(err),
        () => console.log('done')
      );
  return this.result
  }

isLogin(event){
    if(this.Name===''||this.Name===undefined&&this.Pwd===''||this.Pwd===undefined){
      this.check = true;
    }
    this.check = false;
    this.okLogin();
    // this.result = this.okLogin();
    console.log(this.result);
    if(this.result===true){
      console.log('登录成功')
    }else{
      console.log('发生错误')
    }

印出來的效果：
undefined
{data的資料}

之前我初始化了result的值，但是後面當傳入的用戶名和密碼發生變化時，http.get數據已經發生了變化，但是result卻還是之前的值，需要第二次點擊後才正確顯示。

以前我做count++的時候也遇到這個問題，只不過自加當時是直接從0開始，而我不想看到0，只想讓他從1開始，因此我就給count設定了預設值為1

Answer 1

okLogin()方法寫的是有問題的。 subscribe是存在異步行為的。所以在呼叫okLogin的時候就會出現this.result還沒被賦值，isLogin會繼續執行。

修改方案：

(1)Promise方式
(2)修改subcribe寫法

okLogin(){
    return this.http.get('http://localhost:3000/api/users/login/'+this.Name+'/'+this.Pwd+'')
      .map(res => res.json());
  }

isLogin(event){
    if(this.Name===''||this.Name===undefined&&this.Pwd===''||this.Pwd===undefined){
      this.check = true;
    }
    this.check = false;
    this.okLogin().subcribe(data=>{
        this.result = data;
        if(data===true){
          console.log('登录成功')
        }else{
          console.log('发生错误')
        }
    })