繁体   English   中英

角度2:queryParams onInit

[英]angular 2: queryParams onInit

我目前在ActivatedRoute的queryParams上遇到一些问题。 我正在尝试建立一个系统,在该系统中您可以使用queryParams =“?token = 1234”调用任何URL。 如果提供了此参数,则AppComponent将使用此令牌来验证用户。

这样做的原因是,将在不同的应用程序中对用户进行身份验证,该应用程序将接收令牌并将其转发给角度应用程序。

因此,在我的AppComponent中,我有以下代码:

ngOnInit() {

    this._route.queryParams.subscribe(queryParams => {
        if (queryParams['token'] != null) {
            let data;
            this._staffService.getStaffFromToken(queryParams['token']).subscribe(
                (response: any) => data = response,
                (error: Error) => console.error(error),
                () => {
                    if (data.token != null) {
                        this._staffService.setLoggedInStaff(data.staff);
                        this.processLogin();
                    } else {
                        this._router.navigateByUrl('/login');
                    }
                }
            );
        } else {
            if (this._staffService.getLoggedInStaff() != null) {
                this.processLogin();
            } else {
                this._router.navigateByUrl('/login');
            }
        }
    });
}

我完全理解能够订阅这些参数的想法,因为它是SPA,并且在使用应用程序时参数可能会发生变化。

但是,当我转到以下URL: http:// localhost:4200?token = 1234时,它将立即导航到/ login。 由于某种原因,在调用ngOnInit时,它不会立即检测到queryParam。 当我将500的debounceTime添加到queryParams时,它确实可以正常工作,但是我认为这不是一个很好的解决方案。

有人建议吗? 我尝试了不同的方法,但是仍然遇到这个问题。

尝试将代码放在ngOnChanges()并查看ng2 生命周期

使用可观察时,您无法编写同步代码。

尝试这个。

constructor(private activatedRoute: ActivatedRoute) {}
ngOnInit() {
   const token = this.activatedRoute.snapshot.params['token'];
   Your code ...
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM