根据Angular 11中的url更改组件的内容

import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './home.component';

const routes: Routes = [
  { path: 'home/:id', component: HomeComponent }
];

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

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-home',
  template: `
    <h1>Home Component</h1>
    <p>Parameter: {{ id }}</p>
  `
})
export class HomeComponent implements OnInit {
  id: string;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.params.subscribe(params => {
      this.id = params['id'];
      // 根据参数的值更新组件的内容
    });
  }
}

<a [routerLink]="['/home', '1']">Component 1</a>
<a [routerLink]="['/home', '2']">Component 2</a>