Wsrtjtyk

I had implemented lazy loading on already developed application but after implementing, it is loading Any other component other than Home page and this is happening with the Home page only. My root level routing is like this:

{path: '', redirectTo: 'home', pathMatch: 'full'},

  { path: '', loadChildren: './views/home/home.module#HomeModule'},

  { path: 'resetpass', loadChildren: './views/resetpass/resetpass.module#ResetpassModule'},

  { path: 'forgotpass', loadChildren: './views/forgotpass/forgot.module#ForgotpassModule'},

  { path: 'signup', loadChildren: './views/signup/signup.module#SignupModule'},

  { path: 'login', loadChildren: './views/login/login.module#LoginModule' },

  { path: 'otp',  loadChildren: './views/otp/otp.module#OtpModule'},

    { path: 'school', loadChildren: './views/school/school-home/school-home.module#SchoolhomeModule'},    

    { path: 'school/addstudents', loadChildren: './views/school/add-students/add-students.module#AddstudentsModule'},

    { path: 'school/managestudents', loadChildren: './views/school/manage-students/manage-students.module#ManagestudentsModule'},

    { path: 'school/ViewLogsDetails', loadChildren: './views/school/View-Log-Details/logdetails.module#LogdetailsModule'}, 

    { path: 'school/accountinfo', loadChildren: './views/school/accountinfo/accountinfo.module#AccountinfoModule'},

    { path: 'school/subscribe', loadChildren: './views/school/cals-subscribe/cal-subscribe.module#CalsubscribeModule'},

    { path: 'school/addstaff', loadChildren: './views/school/add-staff/add-staff.module#AddstaffModule'},

    { path: 'school/trans-track/:id', loadChildren: './views/school/trans-track/trans-track.module#TranstrackModule'},

    { path: '**', loadChildren: './views/home/home.module#HomeModule' }

On the home page, this loads AddstudentsComponent, even it should work just after login, here is the routing module for AddStudent:

import { NgModule } from '@angular/core';

import { RouterModule, Routes } from '@angular/router';

import { AddStudentsComponent } from './add-students.component';



const routes: Routes = [

    { path: '', component: AddStudentsComponent}

];



@NgModule({

    exports: [RouterModule],

    imports: [RouterModule.forChild(routes)]

})

export class AddstudentsRoutingModule { }

As soon as I change path from '' to something like 'school/addstudent', it start loading AddStaff component.

Entire application was working fine until I put Module in each component level. Don't know how to copeup.

I have included Lazy Loading Module in app.module.ts like this:

import { AddstaffModule } from './views/school/add-staff/add-staff.module';

But I have not done the same with other component level modules. So the application was behaving incosistantly.

What I did now is to remove Component Level Modules from app.module.ts, like this line was removed:

import { AddstaffModule } from './views/school/add-staff/add-staff.module';

And, it becam consistent.