TypeError：无法读取未定义的属性“地图”：带有角度日历的火力答案

【问题标题】：TypeError: Cannot read property 'map' of undefined : firebase with angular calendarTypeError：无法读取未定义的属性“地图”：带有角度日历的火力
【发布时间】：2020-10-03 02:47:18
【问题描述】：

我正在尝试使用带有角度日历的 firebase。我需要重命名我的变量，但我无法使其与异步事件一起使用。这是我所拥有的。

日历服务

 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 我知道这是一个常见错误，但我似乎找不到任何好的解释

【问题讨论】：

标签： angular firebase

【解决方案1】：

我有同样的问题，我改变了语法：

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

到：

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

然后我的 api 中的 JSON 被正常映射。

【讨论】：