Angular4에서 활성화된 경로와 활성화된 경로 스냅샷의 차이점은 무엇입니까?

Angular4에서 활성화된 경로와 활성화된 경로 스냅샷의 차이점은 무엇입니까?

사이의 차이점은 무엇입니까?ActivatedRouteSnapshot그리고.ActivatedRoute각4에서?제가 알기로는ActivatedRouteSnapshot의 자식입니다.ActivatedRoute, 라는 뜻으로ActivatedRoute포함하다ActivatedRouteSnapshot.

공교롭게도 이 질문에 대한 답을 찾기 위해 구글 검색을 실행해 보았지만, 검색 결과 중 어떤 것도 이해할 수 있는 것을 찾지 못했습니다.

감사해요!

부터ActivatedRoute 재사용이 가능하고,ActivatedRouteSnapshot는 특정 버전을 나타내는 불변 객체입니다.ActivatedRoute. 그것은 다음과 같은 모든 속성을 노출합니다.ActivatedRoute일반적인 가치로서, 반면에ActivatedRoute관측 가능한 것으로 드러났습니다.

다음은 구현에 대한 의견입니다.

export class ActivatedRoute {
  /** The current snapshot of this route */
  snapshot: ActivatedRouteSnapshot;

라우터가 구성 요소를 재사용하고 새로운 활성화된 경로를 만들지 않으면 두 가지 버전의ActivatedRouteSnapshot마찬가지로ActivatedRoute. 다음과 같은 라우팅 구성이 있다고 가정합니다.

path: /segment1/:id,
component: AComponent

이제 다음 위치로 이동합니다.

/segment1/1

파라미터는 다음에 표시됩니다.activatedRoute.snapshot.params.id~하듯이1.

이제 다음 위치로 이동합니다.

/segment1/2

파라미터는 다음에 표시됩니다.activatedRoute.snapshot.params.id~하듯이2.

다음을 구현하면 확인할 수 있습니다.

export class AComponent {
  constructor(r: ActivatedRoute) {    
    r.url.subscribe((u) => {
      console.log(r.snapshot.params.id);
    });

경로에서 파라미터를 가져오는 방법은 두 가지가 있습니다.

1. 스냅샷()route.snapshot.paramMap.get). 그 안에서 읽어보세요.

구성 요소를 초기화하는 동안 매개 변수의 초기 값이 한 번만 필요하고 사용자가 동일한 구성 요소에 있는 동안 URL이 변경되지 않도록 하려면 스냅샷을 사용합니다.

• 즉, 제품/2 경로에 있는 경우, 제품/3으로 이동할 수 있는 유일한 방법은 제품 검색 화면으로 돌아가서 제품 상세 정보를 클릭하는 것입니다(상세 구성 요소를 남긴 후 새 경로 매개 변수로 다시 열기).

2. 관측 가능(route.paramMap.subscribe). 구독 중에 구독해주세요.

사용자가 동일한 구성 요소에 있는 동안 경로가 변경될 수 있으면 Observable을 사용하십시오. 따라서 구성 요소의 초기화가 다시 호출되지 않지만 URL이 변경되면 Observable이 가입된 논리를 호출합니다.

• 즉, 제품/2 경로에 있는 경우, 다음 ID 레코드 제품/3으로 이동할 수 있는 "다음" 버튼이 있으므로 사용자가 구성 요소를 탈퇴하거나 다시 열지 않았지만 URL이 새 파라미터를 받았습니다.

일반적으로 말하면 확실하지 않다면 가입하는 것이 가장 안전한 방법입니다.

여기서 다른 답변들에 의해 강조되지 않은 주요 차이점 중 하나는 다음과 같은 사실입니다.ActivatedRoute될 수 ,에수다될다수en될에eod,ActivatedRouteSnapshot수 없다.

이 답변에서 언급된 바와 같이, 당신은 접속합니다.ActivatedRouteSnapshot에 를 주입하여ActivatedRoute하고, 에 는 는 에 snapshot다음과 같은 속성:

constructor(route: ActivatedRoute) { 
  let activatedRouteSnapshot = route.snapshot;
}

에, 를 은 은 에 를 ActivatedRouteSnapshot구성 요소에 직접 입력하면 다음과 같은 오류가 발생합니다.

오류 오류:발견되지 않음(약속 중):오류: 정적 인젝터 오류(AppModule) [구성 요소 -> 활성화된 경로 스냅샷]:정적 인젝터 오류(플랫폼: 코어)[구성 요소 -> 활성화된 경로 스냅샷]:NullInjector 오류: 활성화된 경로 스냅샷에 대한 공급자가 없습니다!

ActivatedRoute 및 ActivatedRouteSnapshot에 대한 설명서도 참조하십시오.

언급URL : https://stackoverflow.com/questions/46050849/what-is-the-difference-between-activatedroute-and-activatedroutesnapshot-in-angu