首页 > 解决方案 > 如何使用 angular8 中的 window.open 将数据作为路径中的参数传递

问题描述

我有列表页面,其中基于单击编辑或查看,它应该在新选项卡中打开个人资料页面。所以我window.open('/profile'+'/' + data.group + '/' + data.profile + '/' + mode,'_blank')在列表页面中使用了单击编辑或查看按钮。所以在这里我还给出了我点击的模式,无论是“编辑”还是“查看”。因此,在单击多个用户时,必须打开多个选项卡以及数据和模式,我曾想过一种方法,在该方法中,我可以将数据和模式作为 url 中的参数传递。但在此之后,我感到震惊,不知道如何前进。这里从 url 参数我如何获取 id 和模式。

http://localhost:4200/profile/101/101/ro

这里

TS:

public editAgent(data, mode) {
    this.selected = { data, mode };
    window.open('/profile'+'/' + data.group + '/' + data.profile + '/' + mode,'_blank')
  }

个人资料页面的路由:

{
        path: '', component:ProfileComponent
    }

在主页中,我给出了这样的个人资料页面路由:

const homeRoutes: Routes = [
  { path: "", component: HomeComponent ,
   children: [
    { path: 'profile/:id/:id/:mode', loadChildren: () => import('../profile/profile.module').then(m => m.ProfileModule) }
  ] }
];

标签: angularurl-routingangular-routingangular-router

解决方案


Angular 路由器提供了一个 activedRoute 服务。 https://angular.io/api/router/ActivatedRoute#params

您可以注入您的 ProfileComponent。

import { ActivatedRoute, Router } from '@angular/router';

constructor(private activatedRoute: ActivatedRoute) {
  this.activatedRoute.params.subscribe((params: Params) => {
  });
}

推荐阅读