Angular2 路由器：无需导航即可获取 URL 的路线

Question

我想 display/hide routerLink 基于来自路由器的一些 Data。指令已完成，但我遗漏了最重要的部分...

例如我有以下路由器配置（省略组件）：

[
  { path: '', children: [
    { path: 'foo', children: [
      { path: 'bar', data: { requiredPermissions: ['a', 'b'] } }
    ]}
  ]},
  { path: 'baz', data: { requiredPermissions: ['c'] }, children: [
    { path: ':id' }
  ]}
]

现在我想问 Router 如果 routerLink 是 /foo/bar 或 /baz/123 将使用的 Route。

我查看了 Router 源代码 ( https://github.com/angular/angular/blob/master/modules/%40angular/router/src/router.ts )，但找不到一些简单的方法来执行此操作。特别是它如何处理这些 :id 变量。

当然我可以遍历 Router.config，越深入越好。但是我必须解析那些变量、正则表达式等。必须有更简单的方法，因为 angular 路由器也必须在内部做所有这些事情。

你有什么想法/解决方案吗？

Answer 1

您可以触发 router.navigateByUrl，等待 RouteRecognized 事件并取消导航（例如使用自定义 Guard）。 RouteRecognized 将拥有所有必要的信息。显然这是不好的解决方案。

还有另一种方法，您可以创建额外的结构（有点映射），它应该包含路径 + 数据。例如结构有路径 struct.baz-route={url:'baz/:id', perm: ['c']}，然后是 [routerLink]="struct.baz-route.url.replace(':id', x)"，然后是 *ngIf="struct.baz-url.perm.indexOf('c')>-1".

Answer 2

嘿，如果你想要来自当前路线的数据，你可以这样做得到那个

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

export class Component {

   constructor(private route: ActivatedRoute){
          let pathroots = this.route.pathFromRoot;
          let pathurl = '';
          pathroots.forEach(path => {

              path.url.subscribe(url => {
                   url.forEach(e => {
                      pathurl += e + '/';
                   });
              });


         });
         console.log(pathurl,'*******************');
       }

 }

Angular2 路由器：无需导航即可获取 URL 的路线

Angular2 Router: Get Route for URL without navigating

angular

angular2-routing

angular2-router3

angular2-router