离子 2 使用事件的正确方式



我的应用程序中有用于身份验证的提供程序 - AuthHelperProvider .当用户尝试登录失败时,应禁用登录按钮。为此,我在我的提供程序中发布事件并订阅LoginPage组件:

身份验证助手提供程序

 this.http.get(query).map(res => <{error: string, clientId: string}>res.json()).subscribe(response => {
      if (response.error == '') {
        console.log(this.TAG + 'log in without errors');
        if (keepSingIn) {
          this.storage.set(this.KEEP_LOGGED_IN, true);
          this.setUsername(login);
          this.setPassword(password);
        }
        this.setClientId(response.clientId);
        this.events.publish('user:login');
        this.attemptCount = 0;
        /*this.navCtrl.setRoot(TabsPage);*/
      } else {
        console.log(this.TAG + 'log in with errors' + response.error);
        this.events.publish('user:failedAttempt',++this.attemptCount);
        this.errorHelper.showErrorAlert(response.error);
      }
    });

登录页面

 this.events.subscribe('user:failedAttempt', (attemptsCount) => {
      console.log(this.TAG + 'number of failed attempts: ' + attemptsCount);
      if (attemptsCount >= 3) {
        this.isLoginBlocked = true;
        this.errorAlert.showErrorToast('Number of attempts exceeded, try to restore your account');
      } else {
        this.isLoginBlocked = false;
      }
    });

但是我遇到了意想不到的行为:订阅事件的处理程序调用了attemptsCount次。这看起来很傻,但我做错了什么?

因为我发现问题在于我对该方法的返回类型的误解events.subscribe()。因此,返回的参数数组应如下所示:

   this.events.subscribe('user:failedAttempt', (attemptsCount) => {
      console.log(this.TAG + 'number of failed attempts: ' + attemptsCount[0]);
      if (attemptsCount[0] >= 3) {
        this.isLoginBlocked = true;
        this.errorAlert.showErrorToast('Number of attempts exceeded, try to restore your account');
      } else {
        this.isLoginBlocked = false;
      }
    });

相关内容

  • 没有找到相关文章

最新更新