在 angular 的路由中传递对象时出现克隆错误

Question

我试图在我的 angular 项目中传递对象而不是单独的字段。但我收到“错误：未捕获（承诺）：DataCloneError：无法克隆对象。” :(

这是代码：

 var errorJsonNav: NavigationExtras = {state:{errorJson:ErrorJsonDTO}};
 this.router.navigate(['error'], errorJsonNav);

这是 DTO：

export class ErrorJsonDTO {
  excepcionProducida: boolean;
  errorDescripcion: string;
  codigoIncidencia: string;
  correcto: boolean;
  falloSistema:boolean;
  horaActual: string;
  mensajeBase: string;

}

这是示例的数据：

字段非常简单，一些字符串和一些布尔值。为什么我有克隆问题？ :(

此致

Answer 1

您没有向状态传递有效值：

{state:{errorJson:ErrorJsonDTO}};

ErrorJsonDTO是一个类型，你需要传一个ErrorJsonDTO

类型的值

如果 errorJson 是 ErrorJsonDTO

类型的有效值，请尝试此操作

 this.router.navigate(['error'], state: { errorJson });

Answer 2

感谢 ritesh 的指导，我做出了解决方案。

组件发送者必须这样编码：

var errorJsonNav: NavigationExtras = {state:{errorJson:errorJson}};
this.router.navigate(['error'], errorJsonNav);

所以第一行的错误是在状态部分。状态必须具有键值格式。不需要指明我发送的对象的类型。

在component receiver中是好的原代码：

var navigation = this.router.getCurrentNavigation();
var state = navigation?.extras.state as {errorJson:ErrorJsonDTO};
this.errorJson = state.errorJson;

在 angular 的路由中传递对象时出现克隆错误

Clone error when passing an object in the route of angular

navigation

clone

routes

angular