2

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)

2
  • You are missing your routing to component in your child module. Commented Feb 14, 2020 at 15:49
  • please include any console snapshot that would help the other person to relate with the error. Commented Jun 1, 2020 at 15:08

3 Answers 3

6

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 { }
Sign up to request clarification or add additional context in comments.

Comments

1

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

Comments

1

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 } ];

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.