skip to Main Content

To implement Lazy Loading in Angular app, we need to add module route / main page (/public/) and then inner page route(/contact-us) like

{ path: 'public', loadChildren: '../public/public.module#PublicModule' }

and inside PublicRouting

{ path: 'contact-us', component: ContactUsComponent }

now for ContactUs component we have url like http://myappurl/public/contact-us . But I want to implement Lazy Loading and also need to access page with link like http://myappurl/contact-us so that my SEO things works as expected. I don’t want to make each page as module and my modules have multiple pages

2

Answers


  1. This might be your required solution:

    Replace public with “ in module path

    i.e. { path: '', loadChildren: '../public/public.module#PublicModule' }

    and let everything remain same.

    So, your final path will be http://myappurl/contact-us

    As you need not to specifically mention public in route, you will automatically redirected to this path.

    Login or Signup to reply.
  2. If you want to achieve this: http://myappurl/contact-us

    Replace public with ” in the module routing

    { path: '', loadChildren: '../public/public.module#PublicModule' }
    

    then do not change anything else

    Or :

    Replace public with ‘contact-us’ in the module routing

      { path: 'contact-us', loadChildren: '../public/public.module#PublicModule' }
    

    and then inside the routing module of public.module

    { path: '', component: ContactUsComponent , pathMath:"full" }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search