Help me Schedule Date Angular

[Tính Ðào Ð?c]

Hello everyone, I am looking for a document about my task, that shows the table looks like this:

 I just know about Syncfusion recently and I see in the Schedule component has something like my problem

but I still don't know how to combine them to make the right request like the picture, the first row has a name and shows about 15 days in a month. In row 2, I have scheduled from day 7 to day 10, In row 3 I have scheduled from day 7 to day 8.

Please help me, thanks alot everyone

[Ravikumar Venkatesan]

Hi Tính,

Sample: https://stackblitz.com/edit/ej2-angular-schedule-resource-customization?file=src%2Fapp.component.ts

UG: https://ej2.syncfusion.com/angular/documentation/schedule/getting-started

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/overview

API: https://ej2.syncfusion.com/angular/documentation/api/schedule/

You can show the 15 days of the month by rendering the Schedule TimelineDay view with intervals of 15 days with the help of the view-wise interval property. To show the date header alone we used the headerRows property of the Schedule. To show the name in the first row we used the renderCell event of the Schedule. You can render the second and third rows of the Schedule with the help of the resources and group properties of the Schedule. You can render the appointments to the specific date range by adding them in the Schedule eventSettings dataSource. We have prepared a sample for your reference. Try the shared sample and refer to the Demo, UG, and API links for more details.

interval:

UG: https://ej2.syncfusion.com/angular/documentation/schedule/views#extending-view-intervals

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/extended-views

headerRows:

UG: https://ej2.syncfusion.com/angular/documentation/schedule/header-rows

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/header-rows

renderCell:

UG: https://ej2.syncfusion.com/angular/documentation/schedule/cell-customization#using-rendercell-event

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/timeline-resource

resources & group:

UG: https://ej2.syncfusion.com/angular/documentation/schedule/resources

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/timeline-resource-grouping

dataSource:

UG: https://ej2.syncfusion.com/angular/documentation/schedule/appointments

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/local-data

Regards,

Ravikumar Venkatesan