angular2使用PrimeNG-Scheduler实现FullCalendar-Scheduler - 资源未显示

时间:2018-05-05 10:36:38

标签: jquery angular typescript fullcalendar primeng

FullCalendar有一个名为Scheduler的附加组件,我试图与PrimeNG-Schedule组件一起使用。看看PrimeNG文档,有一个'选项'我可以用来向FullCalendar发送任意信息的属性。

我正在添加资源,但我仍然无法在日历上看到任何资源。我只能看到没有任何资源的活动。

我将不胜感激任何帮助

    <p-schedule 
    [events]="myevents" 
    [header]="header" 
    [options]="optionConfig"
    >
</p-schedule>

组件

    ngOnInit() {

   this.resources=[
      { id: 'a', title: 'Room A'},
      { id: 'b', title: 'Room B', eventColor: 'green',"start": "2018-05-01" },
      { id: 'c', title: 'Room C', eventColor: 'orange',"start": "2018-05-01" },
      { id: 'd', title: 'Room D', eventColor: 'red',"start": "2018-05-01" }
  ];

      this.myevents = [
        { id: '1', resourceId: 'a', start: '2018-04-06', end: '2018-04-08', title: 'event 1' },
        { id: '2', resourceId: 'a', start: '2018-04-07T09:00:00', end: '2018-04-07T14:00:00', title: 'event 2' },
        { id: '3', resourceId: 'b', start: '2018-04-07T12:00:00', end: '2018-04-08T06:00:00', title: 'event 3' },
        { id: '4', resourceId: 'c', start: '2018-04-07T07:30:00', end: '2018-04-07T09:30:00', title: 'event 4' },
        { id: '5', resourceId: 'd', start: '2018-04-07T10:00:00', end: '2018-04-07T15:00:00', title: 'event 5' }
    ];

this.optionConfig = {
        "resources": this.resources
        }

}

请帮帮我。

1 个答案:

答案 0 :(得分:0)

我让这个工作。一切似乎都很好,但只有在基于时间轴的模式https://fullcalendar.io/docs/timeline-view

时才能看到资源