Maršruta parametru vērtības komponentē Angular

Parametru vērtības, kuras mēs definējam maršrutos, var iegūt komponentes klasē. Apskatīsim, kā to var izdarīt. Pieņemsim, ka mums ir šāds maršruts ar parametriem:

app/app.routes.tsconst routes: Routes = [
  { path: 'aaaa/:id', component: AaaaComponent },
  { path: 'bbbb', component: BbbbComponent },
];

Iegūsim šī parametra vērtību komponentes klasē. Šeit jāpievērš uzmanība tam, ka maršruta parametru vērtības var iegūt tikai tajā komponentē, kas ir piesaistīta maršrutam. Mūsu gadījumā maršrutam ir piesaistīta Aaaa komponente. Tāpēc turpmāk strādāsim ar to.

Tātad, lai iegūtu maršruta parametru vērtības, jāizmanto serviss ActivatedRoute. Importēsim to mūsu komponentē:

app/aaaa/aaaa.component.tsimport { ActivatedRoute} from "@angular/router";

Ieviesīsim servisu konstruktorā:

app/aaaa/aaaa.component.tsexport class AaaaComponent {
  constructor(private activateRoute: ActivatedRoute) {
    
  }
}

Iegūsim objektu ar parametriem:

app/aaaa/aaaa.component.tsexport class AaaaComponent {
  constructor(private activateRoute: ActivatedRoute) {
    let params = activateRoute.snapshot.params;
    console.log(params);
  }
}

Iegūsim mūsu parametra vērtību:

app/aaaa/aaaa.component.tsexport class AaaaComponent {
  constructor(private activateRoute: ActivatedRoute) {
    let params = activateRoute.snapshot.params;
    let id = params['id'];
    console.log(id);
  }
}