具有警报消息的注销用户

时间:2017-03-21 14:00:40

标签: angular typescript angular2-routing

我有一个登录组件来控制登录页面和警报(成功,错误,信息......)。我在页面中时可以显示没有问题的警报,例如,通知用户无效凭据或通知页面正在更新。基本上,此消息是绑定到前端的登录组件类中的变量:

export class Login {
  error;
  info;
}

现在,当用户注销时,我会重定向到登录页面:

this.router.navigate(['/login']);

我想向用户显示警告,通知注销过程成功(实际上我将使用相同的逻辑来通知用户会话是否过期)。我在登录组件类中创建了两个方法:

  logout() {
    this.authenticationService.logout()
        .subscribe(response => {
            this.logoutRedirect();
        },
        error => {
            this.logoutRedirect();
        });
  }

  logoutRedirect() {
      this.authenticationService.removeUser();
      this.info = 'Logout success';
      this.router.navigate(['/login']);
  }

除了消息之外,一切都有效。我相信这是因为当用户被重定向时,使用了一个新的登录类,而且这个登录类没有信息信息。

如何解决这个问题的最佳方法:我会在我的应用程序中大量使用它,所以我想要正确地完成它。

1 个答案:

答案 0 :(得分:0)

我使用服务解决了这个问题。该服务具有警报组件订阅的BehaviorSubject。基本上是:

export class AlertMessagesService {

public alertStatus: BehaviorSubject<AlertMessage>;

public addAlert(msg: string = null, type: string = 'info') {
    this.alertStatus.next({
        show: true,
        msg: msg,
        type: type
    });
}

}

以下是显示警报的组件:

export class AlertMessages implements OnInit {

alerts: Array<AlertMessage> = [];

constructor(
    private alertService: AlertMessagesService) {
}

ngOnInit() {

    this.alertService.alertStatus.subscribe((alert: AlertMessage) => {

        if(alert.show) {
            this.alerts.push(alert);
        }

    });

}

}

我希望如果有人遇到这种情况会有所帮助。

相关问题