7

라우터에서 Data을 기반으로 routerLink을 표시/숨기려고합니다. 이 지침은 이루어집니다,하지만 가장 중요한 부분을 누락 ... 예를 들어Angular2 라우터 : 탐색하지 않고 URL 경로 가져 오기

나는 다음 라우터 설정 (생략 구성 요소) 한 : 나는 Router을 물어 지금

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

싶습니다 routerLink/foo/bar 또는 /baz/123 인 경우 사용되는 Route의 경우

Router 소스 코드 (https://github.com/angular/angular/blob/master/modules/%40angular/router/src/router.ts)로 보였지만 쉽게 할 수있는 방법이 없습니다. 특히 이러한 변수를 처리하는 방법은 무엇입니까?

물론 Router.config을 반복 할 수 있습니다. 더 깊고 깊게 진행됩니다. 하지만 그 변수, 정규 표현식 등을 구문 분석해야합니다. 각도 라우터가 내부적으로이 모든 작업을 수행해야하므로 더 쉬운 방법이 있어야합니다.

아이디어/해결책이 있습니까?

+0

는 현재 경로에서 데이터를 원하는 디 것을 얻기 위해 현재의 경로에서 데이터가이 같이 할 수있는 것보다 싶다면? –

답변

0

필요한 코드는 router/src/recognize.ts입니다. 그러나 개인용 수입이 많은 비공개 API이므로 앱에서 작동시키기가 매우 어려울 것입니다.

대신 router.navigateByUrl을 실행하고 RouteRecognized 이벤트를 기다리고 탐색을 취소 할 수 있습니다 (예 : 맞춤 Guard 사용). RouteRecognized에는 필요한 모든 정보가 포함됩니다. 분명히 그것은 나쁜 해결책입니다.

다른 접근법이 있습니다. path + data가 포함되어야하는 추가 구조 (일종의 맵)를 만들 수 있습니다. 예를 들어, 구조가 struct.baz-route={url:'baz/:id', perm: ['c']} 인 경우 [routerLink]="struct.baz-route.url.replace(':id', x)"이면 *ngIf="struct.baz-url.perm.indexOf('c')>-1"입니다.

-1

이봐 당신은

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,'*******************'); 
     } 

}