當我在 Angular 中單擊后退按鈕時，我無法導航到索引頁面

Question

我有 Angular 項目。 在索引頁上我有一些按鈕，這讓我進入了另一個頁面。 當我想 go 返回索引頁時，我單擊瀏覽器的后退按鈕，然后出現一個白頁，而不是我的索引頁。 你有同樣的問題嗎？

Answer 1

據我所知，這不是 angular 路由的問題。 我建議檢查路由配置是否正確。

假設您已經在您的項目中設置了 angular 路由 ( this )，您必須確保正確注冊索引頁面的路由。 在你的app-routing.module.ts中應該有這樣的東西：

const routes: Routes = [
  { path: 'another-page', component: AnotherPageComponent },
  { path: '', component: IndexPageComponent },
  { path: '**', redirectTo: '' }
]

在您的app.module.ts中，確保已導入BrowserModule和AppRoutingModule 。

如果 angular 路由配置正確，你可以啟用路由調試來查找問題。 其他答案表明這可能會有所幫助（此處，此處）。

Answer 2

我通過以下方式解決了這個問題：我給了我的索引頁（app.component.html）class“mainPage”

<div class="mainPage" #mainPage>
... // index page
</div>

然后我在 app.component.ts 中寫了如下代碼：

export class AppComponent implements OnInit{
  @ViewChild('mainPage') buttons!: ElementRef;
  constructor(private renderer: Renderer2, private el: ElementRef, private router: Router){
      
    router.events.subscribe((eve : any )=>{
        this.currentRoute = router.url;
        if(this.currentRoute == '/'){
          this.showIndex();
        } 
      });
  }
  
  currentRoute : string = "";\
ngOnInit(): void {

  }
  hideIndex(){
    this.renderer.addClass(this.buttons.nativeElement, "d-none");
  }
  showIndex(){
    this.renderer.removeClass(this.buttons.nativeElement, "d-none");
  }
  title = '';
}