NativeScript Angular

RadCalendar for Angular Overview

RadCalendar for NativeScript is a highly customizable native calendar abstraction that exposes a unified API, covering:

  • inline events
  • different view modes
  • cells customization
  • selection


View modes

RadCalendar supports different view modes that are suitable for different application scenarios:

  • Week - displays the dates within one week
  • Month - displays the dates within one month
  • MonthNames - displays the months within a year
  • Year - displays a whole year
  • Day - displays a timeline for a day with its events

For more information about View Modes take a look at the dedicated article: Calendar view modes.

Style customization

RadCalendar has a convenient API for customization of cells and selection indicators. For more information see the dedicated article: Calendar styling .

Calendar transitions

RadCalendar can be customized to animate the transition between different views. For more information take a look at the Transition modes article.

Event source

RadCalendar allows you to define events for a given date by specifying a list of events via it's eventSource property. You can read more about feeding RadCalendar with events in the dedicated article: Populating with data.

Angular directives

When working with RadCalendar with Angular you will need to use the custom Angular directives. Simply use the RadCalendar selector to declare an in the HTML of your Component. Here is a full list of the available custom Angular RadCalendar directives and components:


Represent the major elements:

Selector Class (more details)
RadCalendar RadCalendarComponent