How to get id from the URL using snapshot or ActivatedRoute subscriber in Angular?

问题

I am getting value using snapshot method but it is getting the value after "classes" in this case 20 but I need 33 path like getting

credits/33/classes/20 only 20 or credits/33/classes/ only null("")

Update: I found a solution to my question.

Now it is getting id properly. The mistake is accessing to element in the right child component, didn't work in child's MatDialog component within the Snapshot version.

constructor(private route: ActivatedRoute) {} 
 ngOnInit(): void {
   console.log(parseInt(this.route.snapshot.paramMap.get('id1')));

If your url has 2 Id values, you can use snapshot of route.parent

   console.log(parseInt(this.route.parent.snapshot.paramMap.get('id1')));
}

回答1:

your path in routing module will be

const appRoutes: Routes = [
{ path: 'credits/:id1/classes/:id2', component: YourComponent }];

suppose id1 is 33 and id2 is 20

the code will be: use ActivatedRoute instead of ActivatedRouteSnapshot

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

constructor(private route: ActivatedRoute) {

ngOnInit() {
this.route.params
      .subscribe(
        (params: Params) => {
          this.id1 = +params['id1'];
          this.id2 = +params['id2'];
          console.log(id1 + '' + id2);
        }
      );
    }
}

回答2:

Create a route, in which will be routed to your component, and add it to your module.

const appRoutes: Routes = [
{ path: 'credits/:id1/classes/:id2', component: MyComponent },
{ path: 'credits/:id1', component: MyComponent }];

Then, you can use ActivatedRoute to get your params.

 export class MyComponent implements {
  id1: string;
  id2: string;

  constructor(private route: ActivatedRoute) { 
    this.id1 = this.route.snapshot.params['id1'];
    this.id2 = this.route.snapshot.params['id2'];
  }

}

StackBlitz here

来源：https://stackoverflow.com/questions/56271351/how-to-get-id-from-the-url-using-snapshot-or-activatedroute-subscriber-in-angula