如何在Angular 2中隐藏和显示菜单

时间:2016-08-25 16:30:13

标签: angular typescript

我可以在令牌为空时隐藏一些菜单,但如果没有刷新页面,我就无法进行此操作。

这是我已有的代码:

24.0.2 

任何帮助?

1 个答案:

答案 0 :(得分:1)

这是因为令牌在页面加载时初始化它的值,这就是你需要刷新页面的原因。

我建议你添加一个函数来检查this.getCookie(“Cookie”);值而不是直接检查令牌变量值。

尝试类似:

@Component({
    selector: 'my-app',
    template: `<h1>{{title}}</h1>
    <div><h2>{{resultcooki}}</h2></div>
    <nav>
    <div *ngIf="showMenu()"> 
    <a [routerLink]="['/all']" routerLinkActive="active" >All</a>
    <a [routerLink]="['/one']" >ONE</a>
    <a [routerLink]="['/post']" >Post</a>
    </div>
    <a [routerLink]="['/login']" >Login</a>
    </nav>
    <router-outlet></router-outlet>`,
    directives:[ROUTER_DIRECTIVES],
    providers: [SymfonyService]

})

export class AppComponent {
title = 'Test';

private getCookie(name: string) {
    let ca: Array<string> = document.cookie.split(';');
    let caLen: number = ca.length;
    let cookieName = name + "=";
    let c: string
    for (let i: number = 0; i < caLen; i += 1) {
        c = ca[i].replace(/^\s\+/g, "");
        if (c.indexOf(cookieName) == 0) {
            return c.substring(cookieName.length, c.length);
        }
    }
    return "";
}
showMenu(){
    return (this.getCookie("Cookie") != '');
}
}