Javascript 角度-组件中的显示服务器错误

我目前正在处理一个注册页面，因此，我需要将数据发布到服务器。客户端验证和服务器验证工作正常。我知道我可以处理客户端错误，如

*ngIf=“（emailAddress.errors？.required | | emailAddress.errors？.email）&&emailAddress.touch”

。但是如何处理服务器端错误呢

在我的服务中，如果发生错误，我只需通过

return-throwError（error）将其放入组件中
但是，如果已经有人使用此电子邮件地址，我如何知道在我的组件中显示特定错误？如何区分服务器端的电子邮件/密码验证错误？
取决于您的复杂性和模块

如果您使用任何类型的状态管理库，如ngrx或ngxs，我建议您执行以下操作：


使用属性“error”定义状态，该属性跟踪最新的服务器错误
通过操作执行的Api调用和错误被捕获，并通过操作存储为状态。（在将错误保存到您的状态之前，执行任何错误映射）
使用组件选择器从状态接收错误流

如果您没有任何状态管理库，您可以在singleton服务中创建一个BehaviorSubject，并在您进入任何catchError上下文时使用它发布服务器错误。
这样您就可以编写自己的http拦截器，并在组件中包含您的响应。在组件中，您知道http响应是成功还是错误。
您可以实现其他Http调用（
GET
、
PUT
等），还可以在
handleError（）函数中处理一般错误

app.module.ts

export class AppModule {
   constructor() {}

   imports: [
          HttpClientModule,
   ],
   providers: [
      {
          provide: Http,
          useFactory: httpFactory,
          deps: [HttpHandler]
      },
   ],
}

export function httpFactory(httpHandler: HttpHandler) {
    return new Http(httpHandler);
}

http.service.ts

export class Http extends HttpClient {
   constructor(handler: HttpHandler) {
      super(handler);
   }

   postCall(url: string, body, options?): Observable<any> {
      return super.post(url, body, options)
          .pipe(
             tap(response => { console.log(response) }),
             catchError(this.handleError(error)));
   }

  private handleError<T>(result?: T) {
     return (error: any): Observable<T> => {
        console.log(error);
        return of(result as T);
     };
  }
}

服务器需要返回错误的详细信息，然后前端需要对这些详细信息做出响应，比如给错误添加一个“区域”标记，然后在模板的右侧“区域”显示错误@奥利弗·拉迪尼，你想如何展示它取决于你自己；基本上，您需要调用服务器，服务器需要返回一个错误。前端可以以任何您喜欢的方式对此做出响应
export class YourComponent {
   constructor(private http: Http) {}

   this.http.postCall('URL', {}).subscribe(response => {
      if (response instanceof HttpErrorResponse) {
          // Your Response is error
      } else {
         // Your Response is your desired result
      }
}