Арзишҳои параметрҳои роҳҳо дар компонент дар Angular

Арзишҳои параметрҳо, ки мо дар роҳҳо муайян мекунем, дар синфи компонент гирифтан мумкин аст. Биёед бинем, ки ин чӣ гуна кардан мумкин аст. Бигзор мо роҳи зеринро бо параметрҳо дорем:

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

Биёед арзиши ин параметрро дар синфи компонент гирем. Дар ин ҷо бояд диққат дод, ки арзишҳои параметрҳои роҳро танҳо дар он компоненте гирифтан мумкин аст, ки ба роҳ пайваст шудааст. Дар ҳолати мо ба роҳ компоненти Aaaa пайваст аст. Аз ин рӯ, дар оянда бо он кор мекунем.

Пас, барои гирифтани арзишҳои параметрҳои роҳ бояд хизматрасонии ActivatedRoute истифода шавад. Онро ба компоненти мо ворид мекунем:

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

Хизматрасониро дар сохтгор ворид мекунем:

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

Объект бо параметрҳоро мегирем:

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

Арзиши параметри худро мегирем:

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