时间戳

首页 > 解决方案 > Angular 无法正常启动

angular - Angular 无法正常启动

问题描述

当我在浏览器中打开它时，出现此错误并且页面未加载。

core.js:4197 ERROR Error: Uncaught (in promise): HttpErrorResponse: {"headers":{"normalizedNames":{},"lazyUpdate":null},"status":400,"statusText":"OK","url":"http://127.0.0.1:8080/signups/summary","ok":false,"name":"HttpErrorResponse","message":"Http failure response for http://127.0.0.1:8080/signups/summary: 400 OK","error":{"timestamp":"2021-04-30T11:08:22.168+00:00","status":400,"error":"Bad Request","message":"","path":"/signups/summary"}}
    at resolvePromise (zone-evergreen.js:793)
    at zone-evergreen.js:707
    at rejected (tslib.es6.js:72)
    at ZoneDelegate.invoke (zone-evergreen.js:365)
    at Object.onInvoke (core.js:27436)
    at ZoneDelegate.invoke (zone-evergreen.js:364)
    at Zone.run (zone-evergreen.js:124)
    at zone-evergreen.js:851
    at ZoneDelegate.invokeTask (zone-evergreen.js:400)
    at Object.onInvokeTask (core.js:27424)

问题是我什至没有http://127.0.0.1:8080/signups/summary它应该是的这个端点http://127.0.0.1:8080/summary。

一件事可能会有所帮助。我有两个子模块。其中一个工作正常，另一个则不行。当我进入auth模块内部的某个地方时，它可以工作并发送正确的 api 请求，但pages事实并非如此。

export const routes: Routes = [
  {
    path: '',
    data: { shouldRedirect: true },
    canActivate: [AuthGuard],
    component: AppHomeComponent,
  },
  {
    path: 'auth',
    loadChildren: () => import('./auth/auth.module').then(m => m.AuthModule),
  },
  {
    path: '',
    loadChildren: () => import('./pages/pages.module').then(m => m.PagesModule),
  },
  {path: '**', redirectTo: ''},
];

const config: ExtraOptions = {
  useHash: false,
};

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

我确实卸载并重新安装了节点，角度一切，但它没有帮助。不知道为什么会发生这种情况，并试图解决这个问题几个小时。我将不胜感激在这件事上的任何指示。

编辑

问题出在PagesModule. 模块的导入被破坏导致路由问题。

@NgModule({
  imports: [
    PagesRoutingModule, // <= Moved back to top
    ThemeModule,
    NbMenuModule,
    SignupModule,
    ReportModule,
    UserModule,
    UnauthorizedModule,
//  PagesRoutingModule, <= Was here

  ],
  declarations: [
    PagesComponent,
  ],
})
export class PagesModule {
}

做这个改变解决了这个问题。

标签： angularangular-routing

解决方案

也许您可以通过使用以下命令更新 angular-cli 来解决此问题，而不会干扰tsconfig.app.json文件。

npm install -g @angular/cli@latest

或者

npm install -g @angular/cli

推荐阅读