redirectTo doesn't work in children routes config

[liuwei108]

I have below routes configured:

const routes: Routes = [
    { path: "", redirectTo: "/home", pathMatch: "full" },
    {
        path: "home", component: HomeComponent, children: [
            { path: "", redirectTo:"body", pathMatch: "full" },
            { path: "body", component: BodyComponent}
    ] }
];

Note the line:
{ path: "", redirectTo:"body", pathMatch: "full" }
I expected the path /home will show the BodyComponent, but I can't see the content of BodyComponent it in the page.
Please check the sample in playground.

I also verify the same routes setting in a pure angular 6.0 environment, it works fine.
check the ng app

SO I believe this issue is specific to nativescript, does Nativescript don't support redirectTo in children routes?

[tsonevn]

Hi @liuwei108,
Thank you for the provided sample projects.
We reviewed it and found that this seems to be the default behaviour. In our research, we found that in this scenario, only one redirect will be executed on initial time. Angular will make the first redirect while navigating to the main page, which in this case is home. The other child redirects will not be executed. This behaviour is also described in this article. Check out the One Redirect at a Time part.

Something more, we check the attached angular project as well. In it, we found that on the first load of the Angular app, it will redirect to the HomeComponent and the second child redirect will not be executed. The second redirect in the web project will be performed after refreshing the page. For your convenience, I am attaching GIF file.

Also to navigate to the BodyComponent while starting the app, you can do something like the below-attached example:

const routes: Routes = [
    { path: "", redirectTo: "/home/body", pathMatch: "full" },
    {
        path: "home", component: HomeComponent, children: [
            { path: "", redirectTo:"body", pathMatch: "full" },
            { path: "body", component: BodyComponent}
    ] }
];

[liuwei108]

Hello @tsonevn,

Thanks a lot for the article you mentioned.
By reading the article, I believe the One Redirect at a Time applies to the redirects in same level, but for parent routes redirect and child routes redirect like mine, it should be processed together.
The key line is once an absolute redirect is matched, the redirect phase stops.
So I just changed
{ path: "", redirectTo: "/home", pathMatch: "full" }
to { path: "", redirectTo: "home", pathMatch: "full" }
and it start to work!

[hfakhrul204]

Thank its works ! thank u mate