Question

我正在尝试将对象作为RouteParam传递

let params = { account: 'revenue', page: 3, conditions: [{foo: 'john'}, {foo: 'kelly'}] // <-- Complex object } this._router.navigate(['Journal', params])

但我得到一个像

这样的网址

http://localhost:3000/journal/revenue/3?conditions=[object%20Object],[object%20Object]

IIRC，angular1使用JQuery的$ .param来支持这种类型的序列化（我可能错了）

有没有办法在angular2中达到类似的效果？

Answer 1

因为这些参数是在URL中传递的，所以您可以使用例如JSON.stringify将它们转换为字符串，并在您想要访问它们时使用JSON.parse将它们从路径参数转换为对象。

let params = { 
  account: 'revenue', 
  page: 3, 
  conditions: JSON.stringify("[{foo: 'john'}, {foo: 'kelly'}]") 
};
this._router.navigate(['Journal', params]);

和

constructor(params:RouteParams) {
  var conditions = JSON.parse(params.get('conditions'));
}

另一种方法是使用共享服务。在调用路由之前将对象设置为此服务的属性，并在激活后从路径对应的组件中获取该对象。您可以注意到，在引导应用程序时需要定义共享服务，以便能够共享整个应用程序的单个实例：

bootstrap(AppComponent, [ SharedService ]);

有关详细信息，请参阅此问题：

Angular 2 passing object via route params possible?

angular2 RouteParams，序列化和复杂对象或数组

1 个答案: