ng-fullcalendar 需要仅显示具有特定 ID 的事件

Question

我正在尝试使用ng-fullcalendar为我的Angular应用程序创建一个Scheluder。我没有任何问题就安装了它，但是我只想从我的event.service中呈现一些特定的ID。这是我的ngoninit：

 ngOnInit() {
     this.eventService.getEvents().subscribe(data => {
       console.log(data[0].id);
       this.calendarOptions = {
         editable: true,
         eventLimit: false,
         header: {
           left: 'prev,next today',
           center: 'title',
           right: 'agendaWeek,agendaDay'
         },
         defaultView: 'agendaWeek',
         events: data,
       };
     });
   }

我的事件。服务看起来像：

import { Inject, Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
@Injectable()
export class EventService {
    public getEvents(): Observable<any> {
        const dateObj = new Date();
        const yearMonth = dateObj.getUTCFullYear() + '-' + (dateObj.getUTCMonth() + 1);
        let data: any = [{
            id: 999,
            title: 'All Day Event',
            start: yearMonth + '-01'
        },
        {
            id: 998,
            title: 'Long Event',
            start: yearMonth + '-07',
            end: yearMonth + '-10'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: yearMonth + '-09T16:00:00'
        },
        {
            id: 998,
            title: 'Repeating Event',
            start: yearMonth + '-16T16:00:00'
        }
       ];
        return Observable.of(data);
    }
};

在我看来，在当前情况下，这些事件是在我看来的。例如，我需要更改此代码，以便以ID'999'显示事件。

感谢那些花时间帮助我的人！

Answer 1

您可以使用以下方式过滤：data.filter（ev => ev.id =='999'）;

因此，在您的ngoninit上会这样：

ngOnInit() {
 this.eventService.getEvents().subscribe(data => {
   console.log(data[0].id);
   this.calendarOptions = {
     editable: true,
     eventLimit: false,
     header: {
       left: 'prev,next today',
       center: 'title',
       right: 'agendaWeek,agendaDay'
     },
     defaultView: 'agendaWeek',
     events: data.filter( ev => ev.id == '999'),
   };
 });
   }

您也可以从一个空的事件列表开始，然后使用方法插入它们。

this._calendar.fullCalendar('renderEvents', #your Filtered events#, true);