ionic 3 角度数据不会动态变化答案

【问题标题】：ionic 3 angular data is not changing dynamicallyionic 3 角度数据不会动态变化
【发布时间】：2018-04-28 09:05:38
【问题描述】：

我正在尝试创建一个登录页面，该页面从服务器获取用户数据并显示错误登录/密码的错误消息代码如下所示：

login(x) {
    // alert(this.form.value)
  this.errmsg = "";
  if (x.uid == "" || x.pwd == "") {
    this.errmsg = "Fields should not be empty";
  }else{
    // parameter to pass on class
    var params={
      myclass:this,
    }
      //  Getrequest to get element by id 
    var GetUserById = {
      method: 'GET',
      url: 'http://192.168.136.136:8100/User/' + x.uid + '/',
      headers:
        {
          'Postman-Token': 'a81c98b6-5921-4ab5-bfbc-27dcff4b36ea',
          'Cache-Control': 'no-cache'
        }
      }
      var check=(body, x) =>{
        body=JSON.parse(body)
        if (body.length == 0) {
          return false
        }
        else {
          var uinfo = body[0]
          if (uinfo.Password == x.pwd) {
            window.sessionStorage.setItem('username', uinfo.UserId);
            window.sessionStorage.setItem('Role', this.defineRole(uinfo.Role));
            // window.sess

            return true
        }
        else{
          return false
        }
      }
    }
    var showError=() =>{
      params.myclass.errmsg= "Invalid Username or Password"
    }

    request(GetUserById, function (error, response, body) {
      if (error) throw new Error(error);
      if(check(body, x)){
        params.myclass.navCtrl.push(Home, {});
      }
      // createVerify
      else{
        showError()
        return
      }
    });
    }
 }

html：

<form [formGroup]="form" (ngSubmit)="login(form.value)">
  <ion-list>
    <ion-item>
      <ion-input type="text" formControlName="uid" placeholder="Username"></ion-input>
    </ion-item>
    <ion-item>
      <ion-input type="password" formControlName="pwd" placeholder="Password"></ion-input>
    </ion-item >
  </ion-list>
  <p id="almsg" class="text-right small" >{{errmsg}}</p>
  <div padding>
    <button ion-button type="submit" color="basic" block >Sign In</button>
  </div>
</form>

除非我点击其中一个输入，否则 showerror() 中的 errmsg 不会影响 html 页面。我尝试了 console.log，但效果很好，

【问题讨论】：

检查我的答案............我反馈它是否有效

标签： angular ionic-framework ionic3

【解决方案1】：

试试这个，我猜你没有用错误消息更新类级别变量errmsg。

var showError=() =>{
  //params.myclass.errmsg= "Invalid Username or Password";
  this.errmsg = "Invalid Username or Password";
}

【讨论】：

【解决方案2】：

试试这个

var showError=() =>{
   this.errmsg = "Invalid Username or Password";
}

request(GetUserById, (error, response, body) => {
    if (error) throw new Error(error);
    if(this.check(body, x)){
        this.navCtrl.push(Home, {});
    }
    // createVerify
    else{
        this.showError()
        return
    }
});

【讨论】：

【解决方案3】：

首先 params.myclass.errmsg 和 this.errmsg 不一样，您需要将 params.myclass.errmsg 更改为 this.errmsg 然后就会显示出来

修改sohowError和request

var showError=() =>{
  this.errmsg= "Invalid Username or Password"
}


request(GetUserById, function (error, response, body) {
  if (error) throw new Error(error);
  if(check(body, x)){
    params.myclass.navCtrl.push(Home, {});
  }
  // createVerify
  else{
    showError();
    return false;
  }
});

【讨论】：

我已经尝试了上述方法，但是如果您从服务器获取或在向服务器发送请求后执行它，则不会刷新任何角度数据。