Angular komponentinde ýollaryň parametrleriniň bahalary

Routlarda kesgitleýän parametrlerimiziň bahalaryny komponentiň klasynda alyp bolýar. Geliň, muny nädip edip boljakdygyna göz aýlalyň. Bizde parametrleri bar şeýle bir ýol bolsun:

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

Geliň, bu parametriň bahasyny komponentiň klasynda alyň. Şu ýere üns bermeli: ýollaryň parametrleriniň bahalaryny diňe şol ýola baglanşykly komponentde alyp bolýar. Bizim ýagdaýymyzda, ýola Aaaa komponenti baglanşykly. Şonuň üçin indilik onuň bilen işleris.

Şeýlelikde, ýollaryň parametrleriniň bahalaryny alyp üçin ActivatedRoute serwisini ulanmaly. Ony komponentimize import edeliň:

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

Serwisi konstruktora çägireliň:

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

Parametrleriň objektiň alyň:

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

Parametrimiziň bahasyny alyň:

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