将值传递给路由

Pass values to route

我有一个物品清单。当用户单击某个项目时,用户将被带到项目详细信息页面。

我想将包含项目详细信息(如项目图像 URL)的对象传递给路由。但是,我不想在路由 url 中公开它。

如果有办法做类似<a route-href="route: details; settings.bind({url: item.url})">${item.name}</a>的事情,那将是黄金。

我看到如果在路由配置中定义属性可以传递给路由。但是,我不知道如何从模板中更改它。另一种方法是定义一个单例并将值存储在那里并将对象注入目标路由。

有没有办法将值传递给视图中的路由(如 angular ui-routers param 对象)?

好的,所以我找到了一种方法来实现更接近我想要的东西:

Objective: 将数据传递给路由而不在地址栏中暴露它们。

比方说,我们有一个用户列表,我们想将 username 传递到用户的个人资料页面而不将其定义为查询参数。

在view-model中,先注入Router然后向目的路由器添加数据:

goToUser(username) {
    let userprofile = this.router.routes.find(x => x.name === 'userprofile');
    userprofile.name = username;
    this.router.navigateToRoute('userprofile');
}

现在当路由更改为 userprofile 时,您可以访问路由设置作为 activate 方法的第二个参数:

activate(params, routeData) {
    console.log(routeData.name); //user name
}

对于那些@Sayem 的回答无效的人,您可以将任何其他数据(甚至对象)放入设置 属性 中,如下所示:

let editEmployeeRoute = this.router.routes.find(x => x.name === 'employees/edit');
editEmployeeRoute.settings.editObject = employeeToEdit;
this.router.navigateToRoute('employees/edit', {id: employeeToEdit.id});

因此 editObject 将在另一端传递:

activate(params, routeConfig, navigationInstruction) {
    console.log(params, routeConfig, navigationInstruction);
    this.editId = params.id;
    this.editObject = routeConfig.settings.editObject;
}

希望这可以帮助其他遇到与我相同问题的人。 TG.