angular - 如何获取带有参数的 Url 路径以匹配它以检查 Angular4+ 中的访问？

Question

网址:http://localhost:4200/#/users/company/5263/12

组件:UserDetailsComponent

我已经在我的 user-details-routing.module.ts 中添加了这条路由

{
    path: "company/:companyId/:userId"
    component: UserDetailsComponent,
    canActivate: [AdminGuard]
}

现在我的 Guard 文件中需要下面这个值

users/company/:companyId/:userId

admin.guard.ts

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> | boolean {
        this.loaderService.show();
        let url: string = state.url;  
        // Here I need that value
        return true;        
    }

Answer 1

您可以使用 ActivatedRoute 获取这样的查询参数，然后将其存储在一个变量中。这是示例:

import {Router, ActivatedRoute, Params} from '@angular/router';
import {OnInit, Component} from '@angular/core';

@Component({...})
export class MyComponent implements OnInit {

  constructor(private activatedRoute: ActivatedRoute) {}

  ngOnInit() {
       let url =   this.activatedRoute.snapshot._routerState.url
       let urlSegment = this.activatedRoute.snapshot.routeConfig.path


  }

}

我有这个网址::: http://localhost:4200/product/productDetails/79

我的 url 输出是这样的::: "/product/productDetails/79"

我的 urlSegment 输出是这样的::: "productDetails/:id"

希望这会奏效。