时间戳

首页 > 解决方案 > 在 Angular 6 中只初始化一个变量一次，而不是在每次页面刷新之后

angular - 在 Angular 6 中只初始化一个变量一次，而不是在每次页面刷新之后

问题描述

我刚刚使用 Angular v6.0.3。我对 AngularJS v1.6.9 有一点经验

我正在设计一个基本网页，其登录页面显示 2 个链接：第一个用于登录，第二个用于注册。单击“登录”链接（我添加了（单击）事件）时，我已将路由设置为“/登录”（登录表单是一个组件），并且还使用 ngIf 来隐藏页面上的原始内容。移动到登录组件后，当我刷新页面“localhost:4200/login”时，我使用 ngIf 隐藏的内容再次显示为我在 ngIf 中使用的变量在刷新时被重新加载为值“true”。

如何解决这个问题？提前致谢 ：）

app.component.ts 

export class AppComponent  { 
        myVar = true;
        divReplace = function(){ 
         if(this.myVar == true)
          {
          this.myVar = false;
          }
                               }
                                  }

app.component.html

<div class="fullPage">
  <header>Welcome</header>
 </div> 

  <router-outlet></router-outlet>

<div class="fullPage">
 <div *ngIf="myVar">
  <h3>Please login or sign up to continue :))</h3><br>
  <div id="x"><a routerLink="/login" (click)="divReplace()">Login</a> </div>
  <div>New user? <a routerLink="/signup">Sign Up</a></div>
</div>
</div>

登陆页面

点击“登录”链接后的登录页面

刷新后的登录页面

我希望登录表单下显示的内容即使在刷新后也不显示。我什至尝试使用 constructor() 和 ngOnInit() 使变量只初始化一次，但似乎没有任何效果。甚至网络搜索也没有产生任何解决方案:(

提前致谢！

标签： angular

解决方案

使用会话来存储信息。这样想，你的浏览器怎么知道用它在你的组件类中所说的以外的任何东西来初始化这个值？HTTP 是无状态的，每次刷新都是新的，所以需要存储和会话。

推荐阅读