javascript - Tvinga hård omladdning av en sida när bakåtknappen trycks i Angular


Jag har en Angular 8-app med mer än 100 sidor (komponenter) och använder applikationen endast för Chrome-webbläsaren. Ibland blir CSS:en förvrängd när jag klickar på webbläsarens bakåtknapp och jag måste trycka Ctrl + Shift + R för att få CSS:en att ladda korrekt. Så jag letar efter ett sätt att göra detta automatiskt varje gång webbläsarens bakåtknapp trycks.

Så i princip vill man göra en "Hard Re-Load" när användaren klickar på webbläsarens Tillbaka-knapp på någon av sidorna, så att användaren går tillbaka till föregående sida och "Ctrl + Shift + R" görs automatiskt. Finns det ett Angular-sätt att göra detta för alla sidor? Jag tittade på:

Hur tvingar man en sida att laddas om när man använder webbläsarens bakåtknapp?

men är inte säker på hur man implementerar det i Angular och tillämpar det på alla sidor. Någon hjälp?

Svar #1

Du kan använda en generisk tjänst för att kommunicera mellan komponenter.

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable()
export class BackServiceService  {   
  constructor() { } 
  private paramSource = new BehaviorSubject(false);// inside bracket you can send any type
  sharedData = this.paramSource.asObservable();
  setParam(param:boolean) { this.paramSource.next(param)}    
}

i komponenter med hostlistener kan du lyssna om bakåtknappen klickas och sedan ändra servicevärde

 @HostListener('window:popstate', ['$event'])
  onPopState(event) {
    console.log('Back button pressed');
    this.back.setParam(true);
  }

i komponenten kom du tillbaka du kan kontrollera servicevärdet och

this.back.sharedData.subscribe(result => {
      console.log(result);
      if (result) {
        window.location.reload(true);
        this.back.setParam(false);
      }
    });