title: problem facing in lazy loading in angular 6
body: <p>structure is</p>
  
  <pre><code>1--login component
    1.1--forget password component
    1.2--reset password component
  </code></pre>
  
  <p>For that I created the module named "login module"</p>
  
  <p>Here is my coding:</p>
  
  <p>app.routing</p>
  
  <pre><code> {
  path: '',
  redirectTo: 'login',
  pathMatch: 'full',
  
   },
   {
     path: 'login',
     component: LoginComponent,
  
     children: [
      {
        path: 'login',
        canActivate: [AuthServiceGuard],
        loadChildren: './login/login.module#LoginModule'
      }
     ]
   }
  </code></pre>
  
  <p>login.routing</p>
  
  <pre><code>const routes: Routes = [
   {
    path:'',
    component : LoginComponent,
    data:{
      title:'login'
    },
     children:[{
        path:'forgotPassword',
        component:forgotPwdComponent,
        data:{
          title:'ForgotPassword'
        }
      },
     {
        path:'resetPassword',
        component:ResetPwdComponent,
        data:{
          title:'ResettPassword'
        }
      }]
  </code></pre>
  
  <p>And in login.html i used routerLink as,</p>
  
  <pre><code>&lt;a class="achortag" routerLink="/forgotPassword"&gt;Forgot Password&lt;/a&gt;
  </code></pre>
  
  <p>Now getting error like:</p>
  
  <hr>
  
  <pre><code>core.js:1673 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'forgotPassword'
  Error: Cannot match any routes. URL Segment: 'forgotPassword'
  </code></pre>
  
  <hr>
  
  <p>I called forgetpwdComponent and resetpwdcomponent in loginmodule and </p>
  
  <p>I called loginmodule in appmodule
  Is there any problem in my step which I did. </p>
  
  <p>can anybody guide me??</p>