如何在Angular 2中显示带有消息的错误页面

<div class="error-page">
  <h1>Error</h1>
  <p>{{ errorMessage }}</p>
</div>

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

@Component({
  selector: 'app-error-page',
  templateUrl: './error-page.component.html',
  styleUrls: ['./error-page.component.css']
})
export class ErrorPageComponent {
  errorMessage: string;

  constructor() {
    this.errorMessage = 'An error occurred. Please try again later.';
  }
}

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

@Injectable()
export class MyService {
  constructor(private router: Router) {}

  handleError() {
    // 处理错误的逻辑
    this.router.navigate(['/error']);
  }
}

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ErrorPageComponent } from './error-page/error-page.component';

const routes: Routes = [
  // 其他路由配置
  { path: 'error', component: ErrorPageComponent },
  { path: '**', redirectTo: '/error' } // 处理未知路由的情况
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }