如何在具有Bootstrap的Angular中正确格式化FullCalendar？

Question

我已将Bootstrap-4应用于我的Angular项目。如何使用Fullcalender正确激活themeSystem？

我相信是因为我没有在themeSystem中正确使用bootstrapPlugin。请在下面的代码中告诉我我做错了什么。

import bootstrapPlugin from '@fullcalendar/bootstrap';

export class CalendarComponent implements OnInit {

    constructor(public datesService: DatesService) { }

    @ViewChild('calendar', { static: false }) calendarComponent: FullCalendarComponent; // the #calendar in the template

    calendarVisible = true;
    calendarPlugins = [dayGridPlugin, timeGrigPlugin, interactionPlugin, bootstrapPlugin];
    calendarWeekends = true;
    calendarEvents: EventInput[] = [];
    themeSystem: 'bootstrap';

    public dates: any;


    ngOnInit() {
        this.datesService.getDates()
            .then(res => {
                this.dates = res;
                this.dates.forEach(d =>
                    this.calendarEvents = this.calendarEvents.concat({ 'title': d.projectName, 'start': new Date(d.liveDate) }))
            })
    }

}

日历上的格式看起来不像几个在线示例。请告诉我。谢谢。