1

我有一个组件，用户可以从各个页面访问它。当用户单击该组件中的 OK 按钮时，他应该被重定向到上一页，即。他来到这个组件的页面。

我遇到了window.history.back(); 和this.router.navigate('../')。

另外，window.history.back(); 之间有什么区别？和 this.router.navigate('../')

this.location.back()我也想了解和之间有什么区别window.history.back()。

4

2 回答 2

2

要获得最后一次成功的导航并导航到它，您可以使用：

const lastNav = router.getLastSuccessfulNavigation();

const previousRoute = lastNav.previousNavigation; 

router.navigateByUrl(previousRoute);

注意：由于previousRouteis 类型UrlTree，您可以直接使用它来导航该navigateByUrl方法..

关于 history.back （来自文档）：

history.back() 方法使浏览器在会话历史记录中后退一页。它与调用 history.go(-1) 具有相同的效果。如果没有上一页，这个方法调用什么也不做

Whilethis.router.navigate( '../' )将使用以下方法引导您进入更高级别的导航：<a [routerLink]="['../', 'foo', 'bar']">Go Up</a>

所以不同的是，它window.history.back();会引导你回来并this.router.navigate( '../' )引导你向上。

关于你的最后一个问题：

window对象引用当前帧，它有一个历史对象属性，返回窗口的历史对象->更多信息：https ://www.w3schools.com/jsref/obj_history.asp

虽然location应该从@angular/common构造函数中导入并在其中使用，例如：

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

@Component({
  // component's declarations here
})
class SomeComponent {

  constructor(private location: Location) 
  {}

  goBack() {
    this.location.back();
  }
}

goBack()然后可以通过onClick一个按钮调用该函数Go Back，例如..

查看https://angular.io/guide/architecture-components了解更多详情。

于 2020-10-30T11:58:34.467 回答
0

尝试使用 Location 对象

import {Location} from '@angular/common'; 
constructor(private location: Location){}

并在需要时使用

this.location.back();
于 2020-10-30T11:58:22.690 回答