Angular6ルーターの解決-コンポーネントが呼び出されていません

observablesここでRxJSを二重にネストしているようです-意図したものですか？Resolve角度のインターフェースを見るとき、あなたはそれを正しく実装していますTが、あなたは実際にはObservableそれ自体です：

export interface Resolve<T> {
    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<T> | Promise<T> | T;
}

したがって、リゾルバクラスは次のようになります。

export class CourseDetailResover implements Resolve<[Course, (Lesson[])]>

あなたngOnInitが決して呼び出されないという事実Observableは、あなたのresolveメソッドによって返されたものが決して終了/完了しないという仮定につながります。リゾルバーがその作業を「完了」してルーティングプロセスを続行するには、Observableが完了する必要があることに注意してください。参考のためにこの問題を見てください：

https://github.com/angular/angular/issues/10556

次のコードが機能します

@Injectable({
    providedIn: 'root'
})
export class CourseDetailResover implements Resolve<Promise<Observable<[Course, (Lesson[])]>>>  {

    constructor(private coursesService: CoursesService) { }

    resolve(route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot): Promise<Observable<[Course, (Lesson[])]>> {
            const routerObservable =   this.coursesService.findCourseByUrl(route.params['id'])
            .pipe(
                switchMap(
                    course => this.coursesService.findLessonsForCourse(course.id)
                        .pipe(
                            map<Lesson[], [Course, Lesson[]]>(lessons => [course, lessons]),
                        )
                )
            );

            return new Promise((resolve,reject) => {
                routerObservable.pipe(
                    first()
                ).subscribe((data) => {
                    console.log(data)
                    resolve(routerObservable)});
            })
    }
}

コンポーネント側

  ngOnInit(): void {
    console.log('inside here');
     const observableD:Observable<[Course, (Lesson[])]> = this.route.snapshot.data["detail"];
    this.course$ = observableD.pipe(
      map(data => data[0])
    );

    this.lessons$ = observableD.pipe(
      map(data => data[1])
    );
  }