Проблема с распознавателем маршрута

Question

У меня есть ленивый загруженный маршрут с решателем:

const routes: Routes = [
  {
    path: '',
    children: [
      {
        path: '',
        component: MyComponent,
        resolve: {
          data: MyService
        }
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class MyRoutingModule {}

Мой модуль

@NgModule({
  imports: [
    CommonModule,
    MyRoutingModule,
    ...
  ],
  declarations: [
    MyComponent,
    ...
  ],
  providers: [MyService]
})
export class MyModule {}

Мой сервис resolver:

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> {
    return forkJoin(
      this.getData1(),
      this.getData2(),
      this.getData3()
    );
  }

Я подписываюсь на свойство data в моем компоненте приложения:

export class AppComponent implements OnInit {
  constructor(private route: ActivatedRoute) {}

  ngOnInit() {
    this.route.data.subscribe(x => {
      data = x; //x = undefined
    });
  }
}

Проблемы x всегда undefined
Есть идеи, почему я не могу получить доступ к своим разрешенным данным и как это исправить?

UPDATE: Я хочу знать, когда данные разрешены, поэтому я хочу скрыть счетчик. Согласно публикации @ OneLunch-Man, мой компонент приложения не будет иметь доступа к этим данным, так что как бы вы справились с этим, все, что мне нужно знать о моем компоненте приложения, - это когда данные разрешаются, поэтому я могу сделать некоторое состояние пользовательского интерфейса. изменения, такие как прятание прядильщика и т. д.

Answer 1

Вы можете скрыть и показать счетчик, используя Router Events.А в routerEvent также есть экземпляры ResolveStart и ResolveEnd, которые в соответствии с вашими потребностями

constructor(private router: Router) {
    router.events.subscribe((routerEvent: Event) => {
      if (routerEvent instanceof NavigationStart) {
      this.loading = true;
    }
    if (routerEvent instanceof NavigationEnd ||
        routerEvent instanceof NavigationCancel ||
        routerEvent instanceof NavigationError) {
      this.loading = false;
    }
    });
  }

Ref: https://angular.io/api/router/RouterEvent#subclasses

Answer 2

AppComponent находится за пределами маршрутизатора-розетки и не имеет доступа к этим данным.Только дочерние компоненты маршрута имеют доступ к этому.