Angular 拦截器处理 [object,object]

Question

您好，我正在尝试通过来自我的错误拦截器的 toastr 通知很好地显示 login/register 等的错误。

问题是有时我无法捕捉到所有需要的错误。

这是我的拦截器

    export class ErrorInterceptor implements HttpInterceptor {
  constructor(private router: Router, private toastr: ToastrService) {}

  intercept(
    request: HttpRequest<unknown>,
    next: HttpHandler
  ): Observable<HttpEvent<unknown>> {
    return next.handle(request).pipe(
      catchError((error) => {
        if (error) {
          switch (error.status) {
            case 400:
              debugger;
              if (error.error.errors) {
                const modalStateErrors = [];
                for (const key in error.error.errors) {
                  if (error.error.errors[key]) {
                    modalStateErrors.push(error.error.errors[key]);
                  }
                }
                throw modalStateErrors.flat();
              } else {
                error.statusText = error.error;
                this.toastr.error(error.statusText, error.status);
              }
              break;
            case 401:
              error.statusText = 'Unauthorized';
              this.toastr.error(error.statusText, error.status);
              break;
            case 404:
              this.router.navigateByUrl('/not-found');
              break;
            case 500:
              const navigationExtras: NavigationExtras = {
                state: { error: error.error },
              };
              this.router.navigateByUrl('/server-error', navigationExtras);
              break;
            default:
              this.toastr.error('Something unexpected went wrong');
              console.log(error);
              break;
          }
        }
        return throwError(error);
      })
    );
  }
}

问题位于此处：

if (error.error.errors) {
    const modalStateErrors = [];
    for (const key in error.error.errors) {
        if (error.error.errors[key]) {
modalStateErrors.push(error.error.errors[key]);
              }
            }
            throw modalStateErrors.flat();
          }

这种类型的错误效果很好。

但是当出现多个错误时，问题就来了

或者那样

我尝试了很多方法，但注意似乎有效。那些可以看看吗？我怎样才能捕捉到所有这些类型的错误并正确显示它们

Answer 1

您可能需要执行以下操作：

if(Array.isArray(error.error) {
   error.error.forEach( item => {
     modalStateErrors.push(item); // or whatever value you need from item
   })
}
else {
   modalStateErrors.push(error.error);
}

Angular 拦截器处理 [object,object]

Angular interceptor handling [object,object]

angular

interceptor