如何在 Angular 中查看完整的错误响应？

Question

我正在尝试在我的 Angular 应用程序中显示更详细的错误响应。它在 .Net Core 8 后端运行。

我有以下代码：

        <...>.subscribe(
            () => {
            },
            (err: HttpErrorResponse) => {
                this.busy = false;
                console.log(err);
                console.log(typeof(err));
                this.showErrorSheet('Error', '',
                    `While saving the user, the system encountered this error: ${JSON.stringify(err)}`);
            }
        );

当我运行时出现故意错误（例如重复的用户名）时，err 变量会以字符串形式返回

HTTP 失败响应（省略 URL）：400 OK

同时，Chrome 中的网络选项卡显示更多数据。除了 400 错误代码之外，“响应”选项卡还显示：

用户名已被使用

这就是我想显示的信息。

在.Net Core端，当遇到错误时，我返回：

return BadRequest(errorMessage);

其中 errorMessage 是包含错误的字符串（在本例中为“用户名已在使用中”）。

如何在 Angular 中显示此消息，以便我可以正确地将其显示给我的用户？

Answer 1

您应该能够从 `HttpErrorResponse 的

error 字段获取错误消息。

(err: HttpErrorResponse) => {
  // err.error
}