用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>

我做了一个按钮，我可以在我的应用程序的任何地方重复使用。

创建这个组件

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

@Component({
    selector: 'back-button',
    template: `<button mat-button (click)="goBack()" [color]="color">Back</button>`,
})
export class BackButtonComponent {
    @Input()color: string;

  constructor(private location: Location) { }

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

然后在需要后退按钮时将其添加到任何模板中。

<back-button color="primary"></back-button>

注意:这里使用的是Angular材质，如果你不使用这个库，那么移除垫子按钮和颜色。

在Angular 2的最终版本中。X / 4。x -这里是文档https://angular.io/api/common/Location

/* typescript */

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

@Component({
// declare component here
})
export class MyComponent {

  // inject location into component constructor
  constructor(private location: Location) { }

  cancel() {
    this.location.back(); // <-- go back to previous location on cancel
  }
}

试试routerLink = " - LASTPAGE”

RC4:

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

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

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