也为我工作时，我需要移动回文件系统。 P.S. @angular: "^5.0.0"

<button type="button" class="btn btn-primary" routerLink="../">Back</button>

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

创建这个组件

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材质，如果你不使用这个库，那么移除垫子按钮和颜色。

实际上，你可以利用内置的位置服务，它拥有一个“返回”API。

这里(TypeScript中):

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

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

  constructor(private _location: Location) 
  {}

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

编辑:正如@charith所提到的。Location应该从@angular/common中导入，所以从@angular/common中导入{Location};线条很重要。

只需使用Location，这是一个Angular服务，应用程序可以使用它与浏览器的URL进行交互。

导入:

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

注射:

constructor(private location: Location) { }

简单地使用它:

goBack() {
    this.location.back(); // Navigates back in the platform's history
}

检测到的未更改组件的@Parziphal答案版本:

  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);
  }

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

试试routerLink = " - LASTPAGE”