Свободен Роб
Свободен Роб

Reputation: 2810

Route without parameter value; Angular route redirect - Can I use redirectTo to parameter path?

I'm wandering if it is possible to redirect path: ' ' to path: ':id' ? Is there a way I can achieve this?

Thank you.

{
  path: 'folder',
  children: [
    {
      path: '',
      redirectTo: ':id',
      pathMatch: 'full',
    },
    {
      path: ':id',
      canActivate: [AuthGuard],
      component: DocumentsComponent,
    },
  ]
}

Upvotes: 2

Views: 4750

Answers (3)

Свободен Роб
Свободен Роб

Reputation: 2810

I found a way to redirect 'folder' route to 'folder/:id' with empty 'id' parameter:

{
    path: 'folder',
    redirectTo: 'folder/',
    pathMatch: 'full',
},
{
    path: 'folder',
    children: [
        {
            path: ':id',
            canActivate: [AuthGuard],
            component: DocumentsComponent,
        },
    ]
}

*Note that the redirect must be first.

Upvotes: 7

Madhu Ranjan
Madhu Ranjan

Reputation: 17944

if you give a default id lets say 1 and redirectTo '1' like below it should work,

{
  path: 'folder',
  children: [
    {
      path: '',
      redirectTo: '1',
      pathMatch: 'full',
    },
    {
      path: ':id',
      canActivate: [AuthGuard],
      component: DocumentsComponent,
    },
  ]
}

Hope this helps!!

Upvotes: 3

AngularChef
AngularChef

Reputation: 14087

I don't think you can.

The redirectTo property must be a string, and you would need to pass a link parameters array with a value for the :id param.

It's a bit hackish, but you could redirect the empty path to a hard-coded path associated to a component that redirects to ':id' programmatically (using router.navigate())...

Upvotes: 1

Related Questions