類型錯誤：無法讀取未定義的屬性“地圖”：firebase 和 angular 日歷

Question

我正在嘗試將 firebase 與 angular 日歷一起使用。 我需要重命名我的變量，但我無法使其與異步事件一起使用。 這就是我所擁有的。

日歷服務

 getUserWorkout(){ return this.afAuth.authState.pipe( switchMap(user => { if (user) { return this.db.collection<Workout>('workout', ref => ref.where('uid', '==', user.uid).orderBy('date') ).valueChanges({ idField: 'id' }); } else { return []; } }), ); } }

日歷組件

 import { WorkoutService } from '../workout.service'; import { Workout } from '../workout.model'; function getTimezoneOffsetString(date: Date): string { const timezoneOffset = date.getTimezoneOffset(); const hoursOffset = String( Math.floor(Math.abs(timezoneOffset / 60)) ).padStart(2, '0'); const minutesOffset = String(Math.abs(timezoneOffset % 60)).padEnd(2, '0'); const direction = timezoneOffset > 0? '-': '+'; return `T00:00:00${direction}${hoursOffset}:${minutesOffset}`; } export const colors: any = { red: { primary: '#ad2121', secondary: '#FAE3E3', }, blue: { primary: '#1e90ff', secondary: '#D1E8FF', }, yellow: { primary: '#e3bc08', secondary: '#FDF1BA', }, }; @Component({ selector: 'app-workout', changeDetection: ChangeDetectionStrategy.OnPush, templateUrl: './workout.component.html', styleUrls: ['./workout.component.scss'] }) export class WorkoutComponent implements OnInit { view: CalendarView = CalendarView.Month; workout: Workout[]; sub: Subscription; viewDate: Date = new Date(); events$: Observable<CalendarEvent<{ workout: Workout }>[]>; activeDayIsOpen: boolean = false; constructor(public workoutService: WorkoutService) { } ngOnInit(): void { this.fetchEvents(); } public fetchEvents(): void { const getStart: any = { month: startOfMonth, week: startOfWeek, day: startOfDay, }[this.view]; const getEnd: any = { month: endOfMonth, week: endOfWeek, day: endOfDay, }[this.view]; this.events$ = this.workoutService.getUserWorkout(). pipe( map(({ results }: { results: Workout[] }) => { return results.map((workout: Workout) => { return { title: workout.name, start: new Date( workout.date + getTimezoneOffsetString(this.viewDate) ), color: colors.yellow, allDay: true, }; }); }) ); }

我不斷收到此錯誤，但我無法弄清楚。

 TypeError: Cannot read property 'map' of undefined
    at MapSubscriber.project (workout.component.ts:108)
    at MapSubscriber._next (map.js:29)
    at MapSubscriber.next (Subscriber.js:49)

謝謝 ps 我知道這是一個常見的錯誤，但我似乎找不到任何好的解釋

Answer 1

我有同樣的問題，我改變了語法：

map(({ results }: { results: Workout[] }) => { ...

到：

map((results: Workout[] ) => { ...

然后我的 JSON 從 api 就正常映射了。