проблема с отображением данных в angular-fullcalendar - PullRequest
Новая
       23

проблема с отображением данных в angular-fullcalendar

0 голосов
/ 04 июня 2018

Привет! Все, я использую angular-calendar для нашего приложения, ниже npm введите описание ссылки здесь

пожалуйста, смотрите мой код component.html 

<div class="row justify-content-md-center">
  <div class="col-md-11 setbg no-padd">
    <mwl-calendar-month-view 
    [viewDate]="viewDate"
    [events]="events"></mwl-calendar-month-view>
  </div>
</div>

myКод component.ts ниже 

@Component({
    selector: 'app-book-appointment-view',
    templateUrl: '../views/book-appointment-view.component.html'
})

export class BookAppointmentViewComponent implements OnInit {

    bookAppointmentData: any = {};
    bookAppointmentDataTemp: any[] = [];
    events: any[] = [];
    viewDate: Date = new Date();

    @ViewChild('modalContent') modalContent: TemplateRef<any>;

    constructor(
        private bookService: BookAppointmentService,
        private router: Router
    ) { }
    ngOnInit() {
        this.bookService.getBookAppointmentsMonth(2, { date: '2018-06' })
            .subscribe(suc => {
                console.log('suc', suc);
                this.bookAppointmentData = suc;
                for (let i = 0; i < this.bookAppointmentData.Days.length; i++) {
                    this.bookAppointmentDataTemp.push({
                        start: subDays(startOfDay(this.bookAppointmentData.Days[i].dayId), 1),                   
                        end: addDays(new Date(this.bookAppointmentData.Days[i].dayId), 1),                                                                                   
                        title: 'DoctorsCount: ' + this.bookAppointmentData.Days[i].doctorCount + '\n' + 'Total Appointments: ' + this.bookAppointmentData.Days[i].bookedCount
                            + '\n' + 'Booked: ' + this.bookAppointmentData.Days[i].bookedCount + '\n' + 'Cancelled: ' + this.bookAppointmentData.Days[i].cancelledCount + '\n' +
                            'Missed:' + this.bookAppointmentData.Days[i].missedCount
                    });
                }
                this.showData();
            }, err => { });
    }
    showData() {
        this.events = this.bookAppointmentDataTemp;
    }
}

желаемый вывод enter image description here

но я получил ниже вывод, что неправильно enter image description here

, пожалуйста, помогите мне решить эту проблему

Я пробовал ниже 

<ng-template #customCellTemplate let-day="day" let-locale="locale">
  <div class="cal-cell-top">
    <span class="cal-day-badge" *ngIf="day.badgeTotal > 0">{{ day.badgeTotal }}</span>
    <span class="cal-day-number">{{ day.date | calendarDate:'monthViewDayNumber':locale }}</span>
  </div>
  <div *ngFor="let data of this.bookAppointmentData.Days">
  <small style="margin: 2px">DoctorsCount: {{data.doctorCount}}</small>
  <small style="margin: 2px">Total Appointments: {{data.bookedCount}}</small>
  <small style="margin: 2px">Booked:</small>
  <small style="margin: 2px">Cancelled:</small>
  </div>

, но он показывает пустой календарь какниже

enter image description here если я не использую интерполяцию с пустыми метками

...