用Angular 5.2.9测试过

如果你使用锚而不是按钮，你必须使用href="javascript:void(0)"将其设置为被动链接，以使Angular Location正常工作。

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent {

  constructor( private location: Location ) { 
  }

  goBack() {
    // window.history.back();
    this.location.back();

    console.log( 'goBack()...' );
  }
}

app.component.html

<!-- anchor must be a passive link -->
<a href="javascript:void(0)" (click)="goBack()">
  <-Back
</a>

用Angular 5.2.9测试过

如果你使用锚而不是按钮，你必须使用href="javascript:void(0)"将其设置为被动链接，以使Angular Location正常工作。

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent {

  constructor( private location: Location ) { 
  }

  goBack() {
    // window.history.back();
    this.location.back();

    console.log( 'goBack()...' );
  }
}

app.component.html

<!-- anchor must be a passive link -->
<a href="javascript:void(0)" (click)="goBack()">
  <-Back
</a>

要返回而不刷新页面，我们可以像下面这样在html中做 javascript: history.back ()

<a class="btn btn-danger" href="javascript:history.back()">Go Back</a>

从beta 18开始:

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

我这样做的方式，而导航到不同的页面添加一个查询参数通过传递当前位置

this.router.navigate(["user/edit"], { queryParams: { returnUrl: this.router.url }

读取组件中的这个查询参数

this.router.queryParams.subscribe((params) => {
    this.returnUrl = params.returnUrl;
});

如果returnUrl存在，则启用后退按钮，当用户单击后退按钮时

this.router.navigateByUrl(this.returnUrl); // Hint taken from Sasxa

这应该能够导航到前一页。而不是使用位置。我觉得上面的方法是更安全的考虑情况下，用户直接登陆到你的页面，如果他按后退按钮的位置。回到它将重定向用户到前一页，这将不是你的网页。

进口:

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

构造函数:

constructor(private readonly router: Router, private readonly location: Location) {
  location.onUrlChange(() => this.canGoBack = !!this.router.getCurrentNavigation()?.previousNavigation);
}

可选，避免返回到应用程序之外:

private canGoBack: boolean = false;

constructor(private router:Router,private location:Location){
  this.canGoBack = !!(this.router.getCurrentNavigation()?.previousNavigation);
}

返回:

goBack(): void {
  if (this.canGoBack) {
    this.location.back();
  }
}

Html:

<button (click)="goBack()"></button>