问题解决

通过调换app.module.ts 中import 的 UsersModule.forRoot()和AppRoutingModule顺序解决问题。原因是angular 的路由一旦匹配到路径将不再继续往下匹配。UsersModule 提供了UserService, 期望是一个单例，所以在module中提供了一个forRoot 方法, 同时在Angular官网的Router tutorial: tour of heroes 中看到app-routing.module.ts 最好在最后面引入，因为对于急性加载的component 来说才能被匹配到，而不是匹配到定义在app-routing.module 中的默认路由(default router) 和通配路由(wildcard router)。对于UsersModule 他是一个惰性加载的模块，所以我的理解是可以调整import 顺序。

问题描述

启动本地服务localhost:4200, 期望路由重定向到localhost:4200/#/home, 现象是每次定位到了localhost:4200/#/, 页面一片空白。
项目根模块app.module.ts：

...
@NgModule({
  declarations: [
    AppComponent,
    LoginComponent,
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HttpClientModule,
    UsersModule.forRoot(),
    AppRoutingModule,
  ],
  bootstrap: [AppComponent],
})
export class AppModule { }

app-routing.module.ts：

...
const routes: Routes = [
    {
        path: 'home',
        component: LoginComponent,
    },
    {
        path: 'users',
        loadChildren: () =>
            import('./users/users.module').then((m) => m.UsersModule),
    },
    { path: '', redirectTo: 'home', pathMatch: 'full' },
    { path: '**', redirectTo: 'home' },
];

@NgModule({
    imports: [RouterModule.forRoot(routes, config)],
    exports: [RouterModule],
})
export class AppRoutingModule {}

users-routing.module.ts：

...
const routes: Routes = [{
  path: '',
  component: UsersComponent,
  children: [{
    path: 'list',
    component: ListComponent,
  }, {
    path: 'detail',
    component: DetailComponent,
  }],
}];

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