角度2：queryParams onInit

Question

我目前在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時，它確實可以正常工作，但是我認為這不是一個很好的解決方案。

有人建議嗎？ 我嘗試了不同的方法，但是仍然遇到這個問題。

Answer 1

嘗試將代碼放在ngOnChanges()並查看ng2 生命周期

Answer 2

使用可觀察時，您無法編寫同步代碼。

嘗試這個。

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