Как я могу добавить сегменты в ActivatedRoute? - PullRequest
Новая
       23

Как я могу добавить сегменты в ActivatedRoute?

0 голосов
/ 01 июня 2018

В angularJS, при использовании UI-Router, вы могли по существу называть маршруты, так как каждое состояние имело имя, и вы могли перейти к этому маршруту.

Например: $stateProvider.state("base", { url: "/", controller: "baseController" });, а затем перейти кПо этому маршруту вы можете сделать что-то вроде: $state.go("base");

Я пытаюсь сделать то же самое в angular v5.2 с ActivatedRoute .

Компонент, в котором я нахожусь, имеет маршрут: base/:acctId/:session/upsells/:id/:type

, и я хочу перейти к base/:acctId/:session/config/:id/:type

Я хочу добавить динамический сегмент в ActivatedRouteэто заполнит config/:id, чтобы при навигации по маршрутизатору я мог добавить :type.

Итак, из компонента, в котором я нахожусь (base/:acctId/:session/upsells/:id/:type), я хочу перейти на другой маршрут после добавления пары сегментов в ActivatedRoute и вызова: this.router.navigate([type], { relativeTo: this.activatedRoute }

НетМногое в документации об изменении ActivatedRoute, и я попытался изменить параметры, но кажется, что Маршрутизатор не использует параметры для навигации.Я попытался сделать что-то похожее на комментарий Виктора Савкина к этой проблеме github , но опять же я не уверен в поведении функций Router.navigate.

Я использовал this.router.createUrlTree(['./config', configId, idd], { relativeTo: this.route.parent}), чтобы получитьдерево URL это именно то, что мне нужно, но проблема в том, что функция this.router.navigate принимает объект ActivatedRoute для навигации относительно объекта вместо объекта UrlTree.Существует ли карта для создания объекта ActivatedRoute из дерева URL-адресов?

Моя конфигурация маршрутизатора выглядит следующим образом: 

const routes: Routes = [
    {
        path: "base/:acctId/:session",
        children: [
            {
                path: "config/:configid/:idd",
                component: ListViewItemDetailComponent,
                children: [
                    {
                        path: "type1", <----- i want to get here
                        component: type1Component
                    },
                    {
                        path: "type2",
                        component: type2Component
                    },
                    {
                        path: "type3",
                        component: type3Component
                    }
                ]
            },
            {
                path: "upsells/:id/:type", <------ I am here
                component: UpsellsComponent
            }
        ]
    }
]

Дайте мне знать, если что-то из этого не имеет смысла, испасибо за ваше время.

1 Ответ

0 голосов
/ 02 июня 2018

Установите этот флажок stackblitz POC , где я добавил ту же конфигурацию маршрутизации.

В основном я использовал следующую логику маршрутизации для маршрутизации к указанному маршруту type1 - 

this._router.navigate(['./config/1/2/type1'], {
  relativeTo: this._ActivatedRoute.parent
});

this._ActivatedRoute.parent встает на родительский маршрут, а именно.base/:acctId/:session и затем дается относительный путь для достижения type1, а именно../config/1/2/type1

Надеюсь, это поможет.

...