Angular 2条件显示

Question

我有一个函数loggedIn()，它返回一个内置于angular2-jwt的函数tokenNotExpired()。如果tokenNotExpired()返回true，则该人员已登录（已为其分配了JWT），并且我的应用程序的某些部分会根据此显示为隐藏状态。在页面加载时，页面正确显示元素。如果我已登录然后注销，则该页面的部分应该是隐藏的，但如果我已注销然后登录，则在硬刷新之前不会发生任何变化。

看起来如果它以一种方式工作，它也应该以另一种方式工作。我错过了什么吗？是否有一些我失踪的变化检测？我会把我的代码放在下面，但这是非常基本的东西。

session.ts

import {tokenNotExpired} from 'angular2-jwt';
loggedIn() {
    return tokenNotExpired();
}

app.ts

loggedIn() {
    return this._session.loggedIn();
}

然后在模板中，我分别对要显示/隐藏的部分*ngIf="loggedIn()"或*ngIf="!loggedIn()"。我还尝试了*ngIf="loggedIn() == true"或*ngIf="loggedIn() == false"，以防万一。

****** *******编辑

作为代码的一部分，我认为这可能会有所帮助：

login() {
    this.lock.show((error: string, profile: Object, id_token: string) => {
        if (error) {
            console.error(error);
        }
        localStorage.setItem('profile', JSON.stringify(profile));
        localStorage.setItem('id_token', id_token);
        this._router.navigate(['Dashboard']);
    });
}

这是登录功能，使用Auth0及其锁定小部件登录。

Answer 1

我想出了解决问题的方法。至少在我的情况下，我需要使用NgZone并在登录后调用run函数。据我所知，登录发生时没有组件知道它。使用NgZone.run()重新渲染组件，并且值都已正确更新。

这可能不适用于所有情况，但在这种情况下确实有效。