각도 2 - 부모 경로와 자식 경로에 동일한 리졸버 사용

Question

엔티티 중 하나가 project 인 Angular 2.0 (stable 버전) 앱이 있습니다. 이 projects 각각에 대해, 나는 그것의 세부 사항은 전체의 다른 섹션/경로를 확산 :

• project/:id/overview
• project/:id/documents
• project/:id/logs
• 등 project 반품

이 API의 가장 데이터를 한 번의 호출로 처리하므로 한 번 호출하고 다른 하위 경로에서 사용할 수 있도록해야합니다. 현재 사용하여 확인자 (아무 문제가)와 함께, 성공적으로 프로젝트 데이터를 가져

export const routing: ModuleWithProviders = RouterModule.forChild([ 
    { path: 'projects',     component: ProjectsComponent }, 
    { path: 'project/new',    component: NewProjectComponent }, 
    { 
     path: 'project/:id', 
     component: ProjectDetailComponent, 
     resolve: { 
      project: ProjectDetailResolve 
     }, 
     children: [ 
      { path: '', redirectTo: 'overview', pathMatch: 'full' }, 
      { path: 'overview',   component: ProjectOverviewComponent }, 
      { path: 'documents',   component: DocumentsComponent }, 
      { path: 'logs',    component: LogsComponent }, 
     ] 
    } 
]); 

ProjectDetailComponent : 같은

내 노선 보이는

ngOnInit() { 
    this.route.data.forEach((data: { project: any }) => { 
     this.project = data.project; 
    }); 
} 

을하지만 같은 프로젝트를 전달해야 각 경로에 대해 다른 API 호출을 실행하는 것은 의미가 없으므로 하위 경로까지 내려갑니다.

각도 구성 요소가 경로 데이터도 전달하지만 성공하지는 않을 것이라고 생각하여 하위 구성 요소에 동일한 ngOnInit 코드를 사용하려고했습니다.

어떤 아이디어로주세요?

감사

Answer 1

당신은 부모 해결 프로그램에서 데이터를 얻기 위해 '경로'의 '부모'속성을 사용할 수 있습니다.

ngOnInit() { 
    this.route.parent.data.subscribe(data => { 
     this.project = data.project; 
    }); 
} 

Answer 2

구성 요소 계층 구조에 의해 해결 개체가 얼마나 떨어져 있는지에 따라 parent 속성으로 연결할 수 있습니다.

예 :

ngOnInit() { 
    this.route.parent.data.subscribe(data => this.project = data.project); 
} 

또는 가입

ngOnInit() { 
    this.project = this.route.snapshot.parent.data['project']; 
} 

P.S.없이 구성 요소가 한 수준보다 더 깊은 경우 parent 속성을 무한대로 연결할 수 있습니다. this.route.snapshot.parent.parent.data['project']처럼. 건배!