Angular 11,路由参数在我的情况下不起作用

Angular 11,Route Parameters not working in my case

我一直面临 angular 参数的问题,因为我可以导航路径路由,但是当它调用参数时,我无法获取 id

问题: enter image description here

如何解决这个问题请帮助我

app-routing
----------
const routes: Routes = [
  {path:"", redirectTo:"home", pathMatch:"full"},
  {path:"home",component:HomeComponent},
  {path:"product",component:ProductComponent},`enter code here`
  {path:"prod-details/:id",component:ProductDetailsComponent},  
];

当我尝试通过错误声明变量时

product-details.ts
--------------------
import { Component, OnInit } from '@angular/core';
    import { Router, ActivatedRoute} from '@angular/router';
    

@Component({
  selector: 'app-product-details',
  templateUrl: './product-details.component.html',
  styleUrls: ['./product-details.component.css']
})
export class ProductDetailsComponent implements OnInit {

  constructor(private rout:ActivatedRoute) { }
  product_id="";

  ngOnInit(): void {
   
  this.product_id = this.rout.snapshot.paramMap.get('id');
    
  }

}

这样测试,希望有用:

ngOnInit(): void {

   this.rout.params
   .subscribe( ({id}) => {
      this.product_id = id;
   })   
    
}

这个有效

ngOnInit() {
    this.activatedRoute.paramMap.subscribe(params => {
      if (params.get('id')) {
        this.paramId = params.get('id');
      }
    });
  }