angular - tuple Typescript rxj6 switchMap


Am 2 funcții după cum urmează

findCourseByUrl(courseUrl:string):Observable<Course>


findLessonsForCourse(courseId:string) : Observable<Lesson[]>

Următoarea este implementarea unei clase TypeScript

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

    constructor(private coursesService:CoursesService){}

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

Primesc următoarea eroare de compilare

ERROR in src/app/course-detail/course-detail-resolver.ts(18,9): error TS2322: Type 'Observable<(number | Lesson[])[]>' is not assignable to type 'Observable<[Course, Lesson[]]>'.
  Type '(number | Lesson[])[]' is not assignable to type '[Course, Lesson[]]'.
    Property '0' is missing in type '(number | Lesson[])[]'.

Cum pot rezolva această eroare și să fac funcția resolve să returneze un tuplu

Răspuns #1

Ai o mică eroare în funcția map care face ca lessons să fie un număr. Operatorul map ia un callback care acceptă valoarea fluxului ca prim argument și un index ca al doilea. Vrei ca primul argument să fie obiectul lessons ca rezultat al metodei findLessonsForCourse. De asemenea, trebuie să setezi explicit tipul de return al map, altfel va presupune un array de tipuri unite. De exemplu.

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