錯誤類型錯誤：無法讀取的不確定

Question

財產「地圖」得到這個錯誤，真不知道爲什麼.. 我想顯示在角日曆事件：https://mattlewis92.github.io/angular-calendar/#/async-events

error_handler.ts:1 ERROR TypeError: Cannot read property 'map' of undefined at MapSubscriber.project (planning.component.ts:100) at MapSubscriber._next (map.ts:75) at MapSubscriber.Subscriber.next (Subscriber.ts:95) at MapSubscriber._next (map.ts:80) at MapSubscriber.Subscriber.next (Subscriber.ts:95) at XMLHttpRequest.onLoad (xhr_backend.ts:99) at ZoneDelegate.webpackJsonp.85.ZoneDelegate.invokeTask (zone-mix.js:424) at Object.onInvokeTask (ng_zone.ts:280) at ZoneDelegate.webpackJsonp.85.ZoneDelegate.invokeTask (zone-mix.js:423) at Zone.webpackJsonp.85.Zone.runTask (zone-mix.js:191)

組件。從API TS

import { Component, ChangeDetectionStrategy, OnInit } from '@angular/core'; 
import { Http, URLSearchParams } from '@angular/http'; 
import { HttpClient } from '@angular/common/http'; 
import { CustomDateFormatter } from './custom-date-formatter.provider'; 
import 'rxjs/add/operator/map'; 
import { Observable } from 'rxjs/Observable'; 

interface Event { 
id: number; 
title: string; 
start: string; 
end: string; 
} 

events$: Observable<Array<CalendarEvent<{ event: Event }>>>; 

constructor(private http: Http) { } 

ngOnInit(): void { 
    this.fetchEvents(); 
} 

fetchEvents(): void { 

    this.events$ = this.http 
     .get(this.apiUrl) 
     .map((response) => response.json()) 
     .map(({ results }: { results: Event[] }) => { 
      return results.map((event: Event) => { 
       return { 
        title: event.title, 
        start: new Date(event.start), 
        end: new Date(event.end), 
        color: colors.yellow 
       }; 
      }); 
     }); 

} 

JSON數據

[ 
{ 
"id": 2, 
"user_id": 1, 
"planning_id": 1, 
"start": "2017-09-03T22:00:00.000Z", 
"end": "2017-09-06T12:33:46.271Z", 
"title": "A 3 day event", 
"created_at": "2017-09-05 16:39:47", 
"updated_at": "2017-09-05 16:39:47" 
}, 
{ 
"id": 3, 
"user_id": 1, 
"planning_id": 1, 
"start": "2017-09-03T22:00:00.000Z", 
"end": "2017-09-06T12:33:46.271Z", 
"title": "A 3 day event", 
"created_at": "2017-09-07 13:27:36", 
"updated_at": "2017-09-07 13:27:36" 
} 
] 

Answer 1

您必須導入地圖操作：

import 'rxjs/add/operator/map';