각도 2/4. 재사용 전략. 구성 요소에 재사용되었음을 알리는 방법은 무엇입니까?

Question

우리는 NG2/4 작업을합니다. 우리는 요약 화면에서 세부 화면까지의 탐색을 수행 할 수 있도록 사용자 정의 재사용 전략을 구현하여 사용자가 뒤로 버튼을 클릭 할 때 요약 화면을 동일한 상태 (레크 리 에이션에서 제외)로 유지합니다.

중요한 점은 하위 화면에서 레코드를 편집 할 때 주 화면으로 돌아갈 때 전체 마스터 화면이 아닌 특정 데이터를 다시로드해야한다는 것입니다. 우리는 어떻게 든 관련 데이터가 변경되었고 업데이트해야하는 구성 요소에 정보를 제공해야합니다.

그러나 전략 클래스에는 해당 구성 요소에 대한 액세스 권한이있는 메소드가 없습니다. 클래스는 있지만 인스턴스는 없으므로 구성 요소가 특정 변경 사항을 알리는 방법이 명확하지 않습니다.

public shouldReuseRoute(future: ActivatedRouteSnapshot, current: ActivatedRouteSnapshot): boolean { 
    // I guess here we have to treat it somehow if it is possible 
} 

Answer 1

세부 구성 요소에서 상위 구성 요소 속성에 액세스 할 수있는 경우 각도 변화 감지가 문제 일 수 있습니다. 자세한 내용은 (https://github.com/primefaces/primeng/issues/2606). 세부 구성 요소의 상위 구성 요소 속성에 액세스 할 수없는 경우 공유 서비스를 사용하십시오. 도움이되기를 바랍니다.

Answer 2

같은 문제가있었습니다. 응용 프로그램에 12 개의 구성 요소가 재사용되고 있습니다. 다행히도 이들 모두는 하나의 추상 클래스에서 상속되므로이 솔루션은 한 곳에서만 구현되었습니다.

해결 방법은 꽤 못생긴 것이지만, 그 필요성을 감안할 때 매우 작고 쉽습니다.

1. 라우터를 구성 요소에 삽입하십시오.
2. 라우터 이벤트를 구독하십시오. 구성 요소가 라우터 이벤트를 캡처하는 경우 이는 구성 요소가 남아 있고 사용자가 다시 도착하면 데이터를 새로 고쳐야 함을 의미합니다. 따라서 라우터 이벤트가 발생하면 구성 요소에 플래그를 넣으십시오.
3. 이제 사용자가 언제 돌아 왔는지 알아야합니다. 우리는 기본 후크 ngDoCheck을 재정 의하여이를 추적합니다.
4. 콜백 ngDoCheck 경우라고하여 플래그가 true되고, false로 플래그를 설정하고 데이터
나는 그것이 바로 문제가 구성 요소 사이의 통신 이해하면

constructor(router: Router) { 
    super(); 

    router.events.subscribe(e => { 
    if (!this._reloadData) { 
     this._reloadData = true; 
    } 
    }); 
} 

private ngDoCheck() { 
    if (this._reloadData) { 
    this._reloadData = false; 
    this.resetData(); 
    } 
}