后退按钮事件不会触发Angular

时间:2017-08-15 05:37:30

标签: angular typescript back-button angular-route-segment

我正在尝试将用户重定向到浏览器中单击后退按钮的特定网址,这里是代码

constructor(private router: Router,private location: PlatformLocation) {        
        let eventUrl = window.sessionStorage.getItem('Event');
        this.location.onPopState(() => {
            alert('click');
            this.router.navigate(['/', this.selectedLanguage, 'event', eventUrl]);
        });
    }

但是当用户点击后退按钮时似乎没有触发事件。代码位于当前组件中。问题是什么?

修改

我尝试了以下建议的答案,但这似乎也没有用,函数被调用,但它仍然重定向到上一页而不是下面提到的URL

unload(event: any) {
        let eventUrl = window.sessionStorage.getItem('buyerEvent');
        this.router.navigateByUrl('/' + this.selectedLanguage + '/event/' + eventUrl);
    }

2 个答案:

答案 0 :(得分:2)

您可以在将应用留给window.unload事件时绑定您要执行的操作。我在这里使用了HostListener

@HostListener('window: unload', ['$event'])
unload(event) {
  window.open('https://localhost:4200', '_blank');
  window.close();
}

默认情况下,Chrome会阻止window.open,您必须更改阻止政策。

答案 1 :(得分:-1)

我使用位置

Import { Location } from '@angular/common';

在构造函数上声明

constructor(private _location: Location){}

并制作一个功能

backClicked() {
    this._location.back();
}

然后将其设置为按钮

<button (click)="backClicked()"> TEAM FALL BACK</button>

然后看着魔法发生......