2017-07-19 132 views
0

我目前正在开发一个Angular 2项目。我实现了两个组件(1.标题和2.显示页面内容)。 如果我打开服务,我开始登录/注册。目前,我想隐藏所有其他菜单项。 如果我已登录,我想显示所有菜单项。在Angular 2中动态显示/隐藏菜单栏

目前,我使用* ngIf来显示和隐藏菜单项,实际工作的是什么。我的问题是,如果我开始页面,我没有登录,菜单项不存在(这很好)。不过,如果我登录,只是与页面内容的容器被改变的内容,而不是菜单栏...

目前,我检查,如果我登录或不能以这种方式:

<div *ngIf="user != null"> 
 
...menu items... 
 
</div>

这个作品,如果我重新加载整个页面 - 但我认为应该有显示/隐藏实时的菜单项,无需手动刷新的更好的方式?

您能否帮我解决这个问题?

+0

@ @ CodingMole-请提供更多相关代码的细节,你尝试过的例子和相关的截图。您还需要[以更好的方式]构建您的问题(https://stackoverflow.com/help/how-to-ask)。 –

+0

'angularjs'是基于javascript的角度,即:版本1x。 'Angular'是在TypeScript中角度重写的,即:版本2和4.请为您的问题使用适当的产品名称/术语和标签。 – Igor

+0

谢谢你的回答。我有一个标题显示菜单项。如果我在主框架(其他组件)登录,我想显示更多具体的用户相关菜单项。 目前,我检查,如果我登录或不能以这种方式:

...menu items...
这个作品,如果我重新加载整个页面 - 但我认为应该有显示/隐藏在现实的菜单项的更好的方式时间没有人工刷新? – CodingMole

回答

1

您应该创建一个全球用户服务来跟踪用户状态,并且组件可以订阅,以便始终实时更新用户登录或不登录的位置。

如果你不喜欢那个时候的ngif解决方案,你有几个选择:你可以创建一个全新的组件,并在只有当用户登录时才可访问的路径中显示它,或者你可以做一些事情就像创建一个菜单项数组来控制你的导航菜单项并运行一个ngfor。

您应该回答以获得更多帮助的问题,例如您目前正在跟踪用户状态(您的用户变量)的位置,以及组件如何通知此变量更改?只是猜测,你可能根据本地存储在你的头文件中的构造函数或oninit函数中设置用户变量,然后离开它。这将导致它获得用户一次的值,但以后不会更新,这就是为什么它会在页面刷新时正确显示。