각도 라우팅을 사용하는 방법?

Question

page1 (상위 URL은 parent1 - parent1/page1)이고 2 페이지 (상위 URL은 parent2 - parent2/page2)라고하는 다른 두 페이지에서 액세스 할 수있는 페이지 (예 : page3)가 있습니다.

각도가 기본적으로 URL을 변경하므로 page2에서 탐색하는 경우에만 URL 변경을 방지하고 페이지 1에서 탐색 할 때 URL이 정상적으로 변경되기를 원합니다 (부모 URL이 parent1 인 모든 페이지에 대해) .

우리는

router.navigate('page2',{skipLocationChange: true}); 

하여이 작업을 수행 할 수 있지만이 일반적인 장소에서이 작업을 수행 할 수 있습니다 어떻게 page4, page5, page6 등과 같은 페이지가 더 있기 때문에 나는 단지 특정 페이지에 대한 위치 변화를 방지 할 .

Answer 1

저는 방해받지 않고 깨끗한 방법으로 응용 프로그램 별 요구 사항을 구현하는 도우미 클래스 (또는 기능)에서 라우터 탐색을 래핑하는 것이 좋을 것이라고 생각합니다.

@Injectable 
class LocationAwareRouter { 
    constructor(private router: Router) { 
    } 

    public navigate(url: string) { 
     this.router.navigate(url, { skipLocationChange: this.isLocationChange(url) }; 
    } 

    private isLocationChange(url: string): boolean { 
     return /* your fancy URL evaluation here */ ; 
    } 
} 

당신은 특정 구성 요소에 라우터 이벤트를 구독 할 수

Answer 2

: 상위 URL이 무엇인지 확인하고 같은 history.replaceState()

등의 방법으로이를 대체 할 수 있습니다 이벤트 핸들러에서 https://v2.angular.io/docs/ts/latest/api/router/index/NavigationStart-class.html

(탐색 차기 이후)

모든 규칙이 정의 된 (즉, 무시할 URL과없는 URL) 글로벌 구성 인젝터 블을 작성할 수 있습니다. 이 방법을 사용하면 모두 router.navigate을 리팩터링 할 필요가 없지만 구성 요소 클래스에서 구성 요소별로 규칙을 한 번만 지정하면됩니다.

constructor(router: Router, overrideUrlService: overrideUrlService) { 
    router.events.subscribe(event => { 
    if(event instanceof NavigationStart) { 
     //have the override logic in some injectable service 
     overrideUrlService.checkUrl(event.url); 
    } 
    } 
});