当在routerLink中使用'a'标签时传递输入

Question

我有一个名为user的对象，我想在使用“ a”标记时将其传递给子组件user.component，以创建可路由到该组件的可点击div。

在用户组件中，我具有以下内容。

@Input()
user: user;

当我使用component标签时，它会起作用。

<app-user [user]=user></app-user>

当我尝试将'routerLink'与'a'标签一起使用时，

<a [routerLink]="['/user-dashboard/user', user]">

如何将用户对象作为带有'a'标记的参数传递？

Answer 1

您可能不想将整个对象作为路线传递。

我认为您要尝试的是路由到某个页面，例如/user-dashboard/user/x，其中x是用户的ID。

在这种情况下，您需要将用户的id属性（或称为主键的任何属性）传递给RouterLink，而不是整个对象：

<a [routerLink]="['/user-dashboard/user', user.id]">

如果要将User对象属性传递给新组件，则有几种选择：

1. 从新组件中重新获取它（您可以通过:id类访问ActivatedRoute参数），因此您应该能够为此特定用户查询API。
2. 创建服务以在导航时共享详细信息，然后在新组件中通过服务重新获取它。
3. （不要这样做），您可以JSON.stringify您的用户对象，并将其作为路由参数传递，例如[routerLink]="['/user-dashboard/user', JSON.stringify(user)]">。