Question

我正在使用Ionic 2或3事件，以便将数据从我的登录页面传递到我的页面之间共享的某个提供程序。用户登录后，我想将令牌发送到我的提供商文件并锁定所有路由。基本上我想写代码如 if（token）{允许访问路由} else {no access}

  doLogin() {
    // this.navCtrl.setRoot('MenuPage')
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');

    this.http.post(this.apiUrl + 'login', JSON.stringify(this.user), {headers:headers})
      .map(res => res.json())
      .subscribe(data => {
        this.events.publish('token:added', data.token)

        if(data.login === 'yes') {
          this.token = data.token;
          this.navCtrl.setRoot('MenuPage')
        }
        else {
          alert('Bad login cridentials');
        }
      })
  }

提供商

  ionViewDidLoad() {
    console.log("are we here?")
    this.events.subscribe('token:added', (data) => {
      console.log('>>>>>>>>>>>>>>>>> token added is ', data)
    })
  }

有趣的是，我的提供商在技术上并没有加载到屏幕上，所以我不确定我是否应该使用ionViewDidLoad。但是，为了测试ionViewDidLoad是否有问题，我在菜单页面中导入了上面的函数，但我仍然没有访问令牌：添加数据。我可以看到“我们在这里吗？”记录了字符串，但就是这样。

我正在获取令牌，用户正在登录。我只想使用我的服务器发送到前端的令牌对用户进行身份验证。

是否还有其他方法可以使用push方法将数据从我的登录功能传递给我的提供商，因为我的提供商不会登陆屏幕？

Answer 1

试试这个：

doLogin() {
 // this.navCtrl.setRoot('MenuPage')
 var self = this;
 let headers = new Headers();
 headers.append('Content-Type', 'application/json');

 this.http.post(this.apiUrl + 'login', JSON.stringify(this.user), {headers:headers})
  .map(res => res.json())
  .subscribe(data => {
    self.events.publish('token:added', data.token)

    if(data.login === 'yes') {
      self.token = data.token;
      self.navCtrl.setRoot('MenuPage')
    }
    else {
      alert('Bad login cridentials');
    }
  })

}

在subscribe中，您的范围已更改，因此您无法使用this来引用外部范围。一种方法是将范围存储到变量中，并将该变量用作全局范围。

您也可以尝试在subscribe内打印范围，以便更好地理解。

console.log(self);
console.log(this);

让我知道这是否有效！

Answer 2

提供商不会有ionViewDidLoad事件。因此，对事件的订阅应该在提供者类中的ngOnInit（）回调函数中完成，其余的代码看起来很好。还要确保在登录事件发布之前初始化提供程序。在您的Menupage中，不会记录事件数据，因为您在加载MenuPage之前发布事件。这就是为什么事件订阅中添加的日志不会被执行。

Ionic 2事件未将数据传递到不同的页面

2 个答案: