在 angular 6 中使用浏览器后退按钮更改路线

Question

我在 angular6 中有一个网站，我想使用 onPopState 在单击浏览器后退按钮时更改 URL，但它不起作用。加载所需路由组件的 TS 文件但未能保留并根据浏览器历史记录重定向。

我正在使用下面的代码

constructor(private fb: FormBuilder, 
    private _phonenumberService: PhonenumberService, 
    private router: Router, 
    private apiService: ApiServiceService, 
    public location: Location, 
    public plocation: LocationStrategy) {
            this.plocation.onPopState(() => {
              console.log('Back button pressed');
              this.router.navigate(['/home'],  {replaceUrl:true});
          });

提前致谢。

Answer 1

试试这个。导入 HostListener

import { Component, HostListener } from '@angular/core';

然后绑定事件

@HostListener('window:popstate', ['$event'])
onBrowserBackBtnClose(event: Event) {
    console.log('back button pressed');
    event.preventDefault(); 
    this.router.navigate(['/home'],  {replaceUrl:true});
}

在 angular 6 中使用浏览器后退按钮更改路线

Change route using browser back button in angular 6

back-button

angular6