recherche

Maison  >  Questions et réponses  >  le corps du texte

javascript - angular2 http在点击事件下,第一次点击为undefined,第二次才能获得值

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

怪我咯怪我咯2743 Il y a quelques jours818

répondre à tous(1)je répondrai

  • 黄舟

    黄舟2017-05-15 17:15:55

    La méthode okLogin() est mal écrite. subscribeIl existe un comportement asynchrone. Ainsi, lorsque okLogin est appelé, il apparaîtra que this.result n'a reçu aucune valeur et isLogin continuera à s'exécuter.

    Plan de modification :

    (1)Méthode de promesse
    (2)Modifier la façon d'écrire l'abonnement

    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('发生错误')
            }
        })
        

    répondre
    0
  • Annulerrépondre