.subscribe 中的 router.navigate() 停止应用程序的功能

Question

我正在尝试将用户登录到我的应用程序，成功登录后，用户将被重定向到主页 ( / )。

这里一切正常，用户被重定向到主页，但我无法通过单击主页上的任何链接进行导航。

但是，在检查了这个问题之后，我注意到，当我将this.router.navigate(['/'], { relativeTo: this.route })移出login方法（如下所示）的subscribe块时，页面得到重定向到主页，所有功能似乎都运行良好。

我从subscribe块调用this.router.navigate的方式存在一些问题。 有人可以帮我发现发生了什么吗？ 谢谢。

注意：我也在SO 上发现了一个类似的问题。 在本地分配router的建议答案不起作用。 角度版本 - 11

login(pwd: any){
    this.loginService.login(usrname,pwd).subscribe(
    (response) =>
     {
          console.log("success executed");

          this.router.navigate(['/'], { relativeTo: this.route }).then(x => console.log("????? "+x));
        return;
    },
    (error) => 
    {
         console.log("ERRR  == "+JSON.stringify(error));

    }
   );

}

更新

应用路由模块。

  { path: '', loadChildren: () => import('./home-page/home-page.module').then(m => m.HomePageModule) , pathMatch:"full"},

  {
    path: 'signup',
    loadChildren: () => import('./Reg/Reg.module').then(m => m.RegModule) 

  },

路由模块

import { SignUpComponent } from './sign-up/sign-up.component';

const routes: Routes = [
  { path: '', component: SignUpComponent },
  { path: 'signin', component: SignInComponent },

];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class RegRoutingModule { }

当用户决定登录应用程序时，他们会进入注册页面 ( SignUpComponent )，然后单击链接登录 ( SignInComponent )。 这是一个延迟加载的模块。

Homepage 组件也是一个延迟加载的模块。

更新 2

主页路由模块

import { HomePageComponent } from './home-page.component';


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

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class HomePageRoutingModule { }

Answer 1

很可能是路由配置的问题，或者甚至是某些以意外方式运行的路由守卫的问题。

您是为HomeComponent使用急切加载还是延迟加载？ 显示配置路由的模块会很有帮助，我敢打赌问题出在那里。

---

另外，我很困惑为什么在导航时需要使用{ relativeTo: this.route } 。 理想情况下，此时您不需要任何路由范围。