угловая 10 ошибка маршрутизации и навигации с параметром

массив маршрутов

const routes: Routes = [
 ...
  {path:'exam-list',component: ExamListComponent},
    {path:'exam-panel/:Id',component: ExamPanelComponent}
..
];

импортированный массив

@NgModule({
  imports: [RouterModule.forRoot(routes)],

событие щелчка

onSelect(examdetails)
{
this.router.navigate(['exam-panel',examdetails.Id])
}

по событию клика onselect()

Я получил эту ошибку Ошибка: Uncaught (в обещании): Ошибка: Не удается сопоставить ни один маршрут. Сегмент URL: 'exam-panel' с параметром, когда я использую routerLink, он работает нормально, но событие click не работает с router.navigate

когда я использую [routerLink]=['/exam-panel/',examdetails.Id], он работает, но когда я использую router.navigate, он перемещается по первой панели экзамена маршрута с параметром ok, затем автоматически маршрутизируется к дому страница


angular angular10 angular-routing
person anil singh butola    schedule 12.09.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Как указано в документе https://angular.io/docs/ts/latest/api/router/index/Router-class.html можно использовать либо

navigationByUrl :

router.navigateByUrl(`/exam-panel/${examdetails.Id}`);

или с помощью навигации:

router.navigate(['/exam-panel', examdetails.Id], {relativeTo: route});

относительно вызовов запрашивают навигацию по динамическому пути маршрута относительно текущего URL-адреса.

помните, что мы часто забываем, что / это относительный маршрут. маршрутизатор. для навигации требуется параметр relativeTo для относительной навигации

person Hrishikesh Kale    schedule 12.09.2020
comment
router.navigateByUrl(/exam-panel/${examdetails.Id}) ? каковы ваши детали экзамена. Id идет? вы консоль записали это? - person Hrishikesh Kale; 12.09.2020
comment
examdetails - это массив json, полученный из HTTP-запроса API. - person anil singh butola; 12.09.2020
comment
когда я использую [routerLink]=['/exam-panel/',examdetails.Id], он работает, но когда я использую router.navigate, он перемещается по первой панели экзамена маршрута с параметром ok, затем автоматически перенаправляется на домашнюю страницу - person anil singh butola; 12.09.2020
comment
router.navigate(['/exam-panel', examdetails.Id], {relativeTo: route}); Вы пробовали добавить '/' в router.navgate перед экзаменационной панелью? - person Hrishikesh Kale; 12.09.2020
comment
{relativeTo: route} не могли бы вы объяснить мне, что такое маршрут? - person anil singh butola; 13.09.2020