Угловой 5 routerLink между родительским компонентом и другим родительско-дочерним компонентом

Question

Угловой 5 routerLink между родительским компонентом и другим родительско-дочерним компонентом

1

В приложении Angular 5 есть два отдельных модуля, называемых ядром и администратором.

Основная маршрутизация настраивается как:

const routes: Routes = [
  {
    path: '',
    redirectTo: 'login',
    pathMatch: 'full'
  },

  {
    path: 'admin',
    loadChildren: './../admin/admin.module#AdminModule',
    data: {
      expectedRole: Constants.ADMIN_ROLE_ID
    }
  },
];

Теперь, в модуле admin, маршрутизация такова:

const routes: Routes = [
    {
        path: 'activity',
        children: [
          { path: '', component: ActivityComponent },
          { path: 'detail/:id', component: ActivityDetailComponent }
        ]
    },
    {
        path: 'user',
        children: [
            { path: '', component: UserComponent },
             { path: 'detail/:id', component: UserDetailComponent },
        ]
    }
];

Задача

Если страница приложения находится в "http:localhost/admin/activity", мне нужно добавить routerLink в элемент HTML, чтобы приложение переходило на "http:localhost/admin/user/detail/1".

Что я пробовал

[routerLink]="['user/detail', id] но это приложение занимает "http://localhost/admin/activity/user/detail/1".

Ожидаемый результат

"http:localhost/admin/user/detail/1".

пожалуйста, обратите внимание

Ключевое слово admin в маршруте является динамическим, и я не хочу его жестко кодировать в routerLink.

Sajal 05 фев. 2018, в 13:06

Источник

Теги:

angular

javascript

routing

2 ответа

0

Он попробовал это

   const routes: Routes = [
        {
            path: 'activity',
            children: [
              { path: '', component: ActivityComponent },
              { path: 'detail/:id', component: ActivityDetailComponent }
            ]
        },
        {
            path: 'user',
            children: [
                { path: '', component: UserComponent },
                 { path: 'detail/:id', component: UserDetailComponent },
            ]
        }
    ];
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

RouterModule.forChild (маршруты) используют для обработки других модулей маршрута

Shailesh Singh 05 фев. 2018, в 11:49

0

У меня уже есть это в файле маршрутизации.
Sajal 05 фев. 2018, в 12:54

Ещё вопросы

У меня уже есть это в файле маршрутизации.

Anoop Surendran · Accepted Answer · 2018-02-05T10-51-00.000Z

Эту проблему можно решить, изменив файл admin-routing.module.ts как:

const routes: Routes = [
    {
        path: '',
        component: AdminComponent 
            children: [
                {
                    path: 'activity',
                    component: ActivityComponent,
                    children: [
                        {
                            path: 'view',
                            component: ActivityViewComponent
                        },
                        {
                            path: 'detail/:id',
                            component: ActivityDetailComponent
                        }
                    ]
                },
                {
                path: 'user',
                component: UserComponent,
                children: [
                        {
                            path: 'view',
                            component: UserViewComponent
                        },
                        {
                            path: 'detail/:id',
                            component: UserDetailComponent
                        }
                    ]
                }
        ]
    }
];

Вы можете увидеть два новых компонента: UserViewComponent и ActivityViewComponent, которые просто используются для просмотра вашего текущего UserComponent и ActivityComponent соответственно.

Замените содержимое user.component.html (поместите его в user-view.component.html) и activity.component.html (поместите его в activity-view.component.html) с помощью <router-outlet></router-outlet> что очень важно в этой задаче.

Теперь вы можете получить доступ к этим компонентам как

/Администратор/деятельность/просмотр
/Администратор/деятельность/подробно/: идентификатор
/Администратор/пользователь/просмотр
/Администратор/пользователь/подробно/: идентификатор

Вы можете найти более подробную информацию здесь

Я понимаю, что это один из способов сделать это, но мне больше интересно делать это при сохранении маршрутов для детей. Я думаю, что routerLink способен обрабатывать регулярные выражения, чтобы, вероятно, решить эту проблему.
Я понимаю ваше требование. Давайте работать над этим
Хорошо. Я посмотрел вокруг на Google, но не нашел ничего. Что ты предлагаешь?
Эй, я обновил ответ. Попробуйте это
Я закончил тем, что делал то, что вы предложили ранее.