Angular 21 Scheduling Tutorials

Angular application with real-time filtering of Scheduler component rows (by name, by number of events).

How to find, focus and highlight a Scheduler row that matches the search criteria.

Angular tutorial that shows how to implement undo/redo functionality for the DayPilot Lite Angular Scheduler UI component.

Angular tutorial that shows how to link related events in the Angular Scheduler UI component.

This tutorial shows how to use the Angular Scheduler component to manage resources (create, edit, delete, move) using the Scheduler UI.

Angular 21 application that displays the Scheduler in a full-page layout with a collapsible sidebar, date navigation, and switchable 100% height modes.

How to calculate resource utilization for time slots and show a bar chart in a fixed row displayed at the top of the Angular Scheduler component.

Angular 21 project that displays a task hierarchy using a Gantt Chart UI component. The frontend Angular application is connected to a PHP JSON backend with SQLite or MySQL storage.

An Angular project template that you can use as a starting point for your own implementation of an interactive timesheet. Learn how to adjust the timesheet appearance and add visual elements.

Build an Angular annual leave scheduling application with REST backend created using ASP.NET Core and Entity Framework.

Angular 21 application that shows how to switch the Angular Scheduler (which is in "edit" mode by default) to read-only mode.

How to change the Angular Scheduler component appearance using a CSS theme. You can use one of the predefined themes or create your own theme using an online tool.

Use Angular lazy loading feature to improve the initial load time of your Scheduler application.

How to integrate Angular event calendar component with a date picker and navigation buttons for changing the visible week.

How to activate the free-hand date range selection mode in the Angular date picker component (Navigator).

Angular tutorial that shows how to highlight global and resource-specific holidays in the Angular Scheduler UI component.

Angular application that shows how to apply a custom CSS theme to the calendar component and change it on the fly.

This tutorial shows how to implement undo/redo functionality the for the open-source Angular Calendar component.

Angular application that shows how to create a resource calendar Angular component that displays event data in multiple columns. The resource calendar supports drag and drop out of the box.

Angular project that displays an event calendar component with day, week and month views that share the same data and can be easily switched. A date picker component is used to switch the current date and highlight busy days.