nativescript-angular: Lazy loaded module route redirectTo ignored or not working

Works fine on Angular 9.1.7:

// parent 'main' module
const routes: Route = [
...
{
                path: 'cool',
                loadChildren: () => import('@libs/cool-feature').then((m) => m.CoolFeatureModule),
}
...

// inside cool-feature-routing.module
const coolRoutes: Routes = [{
    path: '',
    component: CoolLayoutComponent,
    children: [
        {
            path: '',
            redirectTo: 'first',
            pathMatch: 'full'
        },{
            path: 'first',
            component: CoolFirstComponent
       }
... //some other internal paths
]
@NgModule({
    exports: [RouterModule],
    imports: [RouterModule.forChild(coolRoutes)]
})
export class CoolFeatureRoutingModule {
}

// and insdide CoolFeatureModule 
@NgModule({
    declarations: [
        CoolFirstComponent,
        CoolSecondComponent
    ],
    exports: [],
    imports: [
        CoolFeatureRoutingModule,  <-- issue was when this module was listed as a last item inside imports array
        CommonModule,
        FormsModule,
        CoreModule
    ]
})
export class CoolFeatureModule {}

So again if CoolFeatureRoutingModule goes as a last element of NgModule imports array - redirection fails without any error in console. If CoolFeatureRoutingModule goes as a first element of NgModule imports array - everything works fine.

@darkyelox I was able to resolve your case with the usage of children routing property as shown here.

For your convenience, here is the modified Playground demo. The things that have changed are the lazily loaded routing table

home-routing.module.ts

// home-routing.module.ts
const routes: Routes = [
    {
        path: '',
        children: [
            {
                path: '',
                redirectTo: 'home',
                pathMatch: 'full'
            },
            {
                path: 'home',
                component: HomeComponent
            }
        ]
    }
]

I’ve also changed the app-routing.module.ts file (mainly for readability to avoid multiple home paths but also to remove the / infront of the main path)

// app-routing.module.ts
const routes: Routes = [
    { path: "", redirectTo: "main", pathMatch: "full" },
    { path: "main", loadChildren: "./home/home.module#HomeModule" }
];

Remember that i’m talking about lazy loaded modules and the redirect not works no matters what i do, simply is ignored:

You can test it in the playground link in my first comment, i update it with your workaround and that not work, this issue must not be closed

I was facing issues with lazy loading modules as I’ve been generating modules with VSCode and it was registering the modules and importing them in the root module. On removing the import in root module all went fine.

@darkyelox the issue is not a bug as it appears that we should use the path without a slash For example:

const routes: Routes = [
    { path: "", redirectTo: "home", pathMatch: "full" },  // notice the redirectTo: "home" (lacks a slash)
    { path: "home", component: HomeComponent }
];

Confirming that using redirectTo from lazily loaded module does not seem to work as expected.

For everyone facing a similar problem using the RoutingModule as first import in the imports of the module works as @LeonVay said, also as @NickIliev pointed we shouldn’t use “/” in redirects ( mainly not in the root app routing module for loading a lazy module )

I was having this issues and after a day wasting searching for answers I figured out that I was adding a slash / in the app-routing file during redirection { path: '', redirectTo: '/dashboard', pathMatch: 'full', }, make sure you don’t have a / in redirectTo like { path: '', redirectTo: 'dashboard', pathMatch: 'full', },

one question

const routes: Routes = [
    { path: "", redirectTo: "/home", pathMatch: "full" }, <--- why do you need this ?
    { path: "home", component: HomeComponent }
];

can’t you just do

const routes: Routes = [
    { path: "", component: HomeComponent }
];

?