Javascript 如何在从上一页单击按钮路由到该页后刷新该页

Javascript 如何在从上一页单击按钮路由到该页后刷新该页,javascript,angular,typescript,Javascript,Angular,Typescript,我有两页,一页主页和第二页。当我点击主页上的一个按钮时,它正在发送到第2页。现在,在单击主页上的按钮后,当我进入第2页时,它应该是刷新的,因为我的项目中存在一些缓存问题。我在ngoninit上添加了window.location.reload(),但我的页面在不断刷新。 下面是代码 home.component.ts 您不需要手动重新加载。如果您始终路由到特定组件,您将获得一个新组件。如果你能解释更多关于你的问题,我可以帮你。你不需要手动重新加载。如果您始终路由到特定组件,您将获得一个新组件。如

我有两页,一页主页和第二页。当我点击主页上的一个按钮时,它正在发送到第2页。现在,在单击主页上的按钮后,当我进入第2页时,它应该是刷新的,因为我的项目中存在一些缓存问题。我在ngoninit上添加了window.location.reload(),但我的页面在不断刷新。 下面是代码

home.component.ts
您不需要手动重新加载。如果您始终路由到特定组件,您将获得一个新组件。如果你能解释更多关于你的问题,我可以帮你。

你不需要手动重新加载。如果您始终路由到特定组件,您将获得一个新组件。如果你能解释更多关于你的问题,我可以帮你。

我删除了之前编辑的答案,因为它被欺负了。 唯一的方法是使用即使在重新加载js(在window.location.reload();)时仍然存在的信息,因为所有其余信息都将丢失。您可以使用localStorage(与localStorage.setItem('firstReload','true');)


这里有一个有效的修改示例:

我删除了先前编辑的答案,因为它受到了欺凌。 唯一的方法是使用即使在重新加载js(在window.location.reload();)时仍然存在的信息,因为所有其余信息都将丢失。您可以使用localStorage(与localStorage.setItem('firstReload','true');)


这里有一个改进的工作示例:

谢谢你的回答,第一次不刷新。是的,我做了一个小的修改,使它即使在第一次尝试时也能工作。要测试它,请从“localStorage”中删除“firstReload”键。如果我的答案对您有用,请投票。感谢您的答案,第一次不刷新。是的,我做了一个小更正,使它即使在第一次尝试时也能工作。要测试它,请从“localStorage”中删除“firstReload”键。如果我的答案对您有用,请投票。
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
  selector: 'app-home',
  template: '<button (click)="gonextPage()">Go to next page</button>',
  styleUrls: ['./home.component.css']
})

export class HomeComponent implements OnInit {
imageSource :any;
statusdata1: any;
moreThanTen:boolean = false;
showit:boolean = false;
groupList:any = [];

constructor(private router: Router) { }
gonextPage(){
this.router.navigateByUrl('/page2');    
}
  ngOnInit() {
     // window.location.reload();
    /* First data */
    let response = 
    {"vehicle_number":1,"vehicle_name":"car","status":"yellow"}
    let response1 = {"vehicle_number":0,"vehicle_name":"car","status":"yellow"}
    let response2 = {"vehicle_number":2,"vehicle_name":"car","status":"yellow"}
    this.groupList.push(response,response1,response2);
    console.log(this.groupList);




  }

}
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
  selector: 'app-page2',
  template: '',
  styleUrls: ['./page2.component.css']
})

export class page2Component implements OnInit {
imageSource :any;
statusdata1: any;
moreThanTen:boolean = false;
showit:boolean = false;
groupList:any = [];

constructor(private router: Router) { }

  ngOnInit() {
     window.location.reload();
    /* First data */
    let response = 
    {"vehicle_number":1,"vehicle_name":"car","status":"yellow"}
    let response1 = {"vehicle_number":0,"vehicle_name":"car","status":"yellow"}
    let response2 = {"vehicle_number":2,"vehicle_name":"car","status":"yellow"}
    this.groupList.push(response,response1,response2);
    console.log(this.groupList);




  }

}
  ngOnInit() {
    if (!localStorage.getItem('firstReload') || localStorage.getItem('firstReload') == 'true') {
      localStorage.setItem('firstReload', 'false');
      window.location.reload();
    } else {
      localStorage.setItem('firstReload', 'true');
    }
  }