CODEWITHSUNDEEP
angularroutesloadlazy-evaluation
Nick Wills
Nick Wills

Reputation: 1138

Angular 8 - Lazy Loading of Module not working

As shown in https://stackblitz.com/edit/angular-qbbhgp, I am trying to achieve a very simple routing which involve lazy loading of module. When I click on the "link", it seems not working. I expected to see the word "Student Page" appear, but it did not happen.

Note that I would like the solution to involve the use of import api (the newer syntax to lazy load module)

Upvotes: 2

Views: 13711

Answers (3)

Sats
Sats

Reputation: 1973

You have not provided a Routes for Student.routing.module?

Since you have directed the student.module, but you might have not provided from there what component you have been show.

If you have not created to Student.routing.module, create one and provide a default route in the same module.

const routes: Routes = [

  {path: '', component:StudentComponent } ];

Upvotes: 1

Pierre-Luc
Pierre-Luc

Reputation: 160

You have to define the routes of the lazy loaded module and specify the root component of the lazy loaded module.

Upvotes: 1

Kurt Hamilton
Kurt Hamilton

Reputation: 13515

It's because you haven't added routing to your student module.

Fork of your stackblitz: https://stackblitz.com/edit/angular-zrnrxj

The student module needs to use .forChild() when declaring routes since it is a child module.

const routes:Routes = [
  { path: '', component: StudentComponent } 
]

@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(routes)
  ],
  declarations: [StudentComponent]
})
export class StudentModule { }

Upvotes: 6

Related Questions