Javascript 如何使用同一组件在角度方向布线

我正在为我的路由器使用相同的组件，第一次单击受影响的组件，但下一次单击仍处于第一种状态的组件

下面是更改路线的脚本

<a [routerLink]="['react/1']">link 1</a>

小组课程.component.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router'
import { PanelCoursesComponent } from 'src/app/components/panel-courses/panel-courses.component';
import { PanelHomeComponent } from 'src/app/components/panel-home/panel-home.component';
import { PanelIntroComponent } from 'src/app/components/panel-intro/panel-intro.component';

const routes: Routes = [
    { path: '', component: PanelHomeComponent },
    { path: 'react', component: PanelIntroComponent },
    { path: 'react/:no', component: PanelCoursesComponent } //the target
]

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

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

@Component({
  selector: 'app-panel-courses',
  templateUrl: './panel-courses.component.html',
  styleUrls: ['./panel-courses.component.scss']
})
export class PanelCoursesComponent implements OnInit {
  url!: any

  constructor(private route: ActivatedRoute, private router: Router) {
    console.log('route')
  }

  ngOnInit(): void {
    this.url = this.router.url
    console.log(this.route.snapshot.params) //the test script
  }

}

在PanelCourseComponent上，我试图通过控制台记录参数，但在第一次单击时只执行了一次

---

我遗漏了什么吗？

对于这种情况，您可以使用

this.route.params.subscribe

方法

这是一个例子

ngOnInit(): void {
    this.route.params.subscribe(params => {
      console.log(params) // It will be executed whenever you click the link
    })
  }

---

默认情况下，

pathMatch

设置为

“前缀”

。因此，路径将与当前位置匹配，第一个“匹配”将呈现其组件。要使路径仅与“精确”匹配，请为路径添加

pathMatch:“full”

const routes: Routes = [
    { path: '', component: PanelHomeComponent, pathMatch: 'full' },
    { path: 'react', component: PanelIntroComponent, pathMatch: 'full' },
    { path: 'react/:no', component: PanelCoursesComponent } //the target
]

---

语法不应该是

[routerLink]=“['react'，'1']”吗？

？我已经尝试过了，但还是一样的

const routes: Routes = [
    { path: '', component: PanelHomeComponent, pathMatch: 'full' },
    { path: 'react', component: PanelIntroComponent, pathMatch: 'full' },
    { path: 'react/:no', component: PanelCoursesComponent } //the target
]