如何在不重新加载页面的情况下"刷新"Angular 中的组件？

Question

如果用户未登录，我的应用程序的菜单栏应具有文本输入和登录按钮，并且在用户登录时应具有注销按钮。这两个群体是相互排斥的。

我编写的代码如下：

<div *ngIf=”userNotLoggedIn”>
<li>some li</li>
</div>
<div *ngIf=”!userNotLoggedIn”>
<li>some other li</li>
</div>

userNotLoggedIn最初设置为true，并在登录成功后更新为false。我的问题是userNotLoggedIn值的变化不会更新我的组件，即我仍然看到登录名/密码文本而不是注销链接。

我也尝试了这个变体，但这也不起作用

<div >
<li [hidden]=”userNotLoggedIn”>some li</li>
</div>
<div>
<li [hidden]=”!userNotLoggedIn”>some other li</li>
</div>

userNotloggedIn:boolean被定义为布尔值，我将其初始值设置为truengOnInit

ngOnInit(){
this.userNotloggedIn = true;
}

Answer 1

确保为*ngIf设置bool，并且正确使用否定。它应该与您提供的第一个示例完美匹配。