jQWidgets
  • Docs
  • License and Pricing
  • Services
  • Community
    • Forums
    • Blogs
    • Follow Us
    • Client Login
  • About
    • About Us
    • Contact Us
    • FAQ
  • Products
    • Angular
    • React
    • Vue
    • jQuery
    • Web Components
    • Blazor
    • Templates
  • Download
Angular UI Components
  • Javascript/jQuery
  • Angular
  • Vue
  • React
  • Web Components
  • Blazor
  • ASP .NET MVC
  • Templates
  • Theme Builder
  • Artavolo
Show Demo List

Angular UI Components (Angular 19 is supported)

  • jqxGrid
  • jqxTabs
  • jqxTextArea
  • jqxWindow
  • jqxKnob
  • jqxResponsivePanel
  • jqxGantt
  • jqxChart
  • jqxMenu
  • jqxInput
  • jqxDocking
  • jqxGauge
  • jqxNavBar
  • jqxPivotGrid
  • jqxTree
  • jqxPasswordInput
  • jqxNotification
  • jqxBarGauge
  • jqxSortable
  • jqxScheduler
  • jqxNavigationBar
  • jqxMaskedInput
  • jqxPopOver
  • jqxExpander
  • jqxLoader
  • jqxTreeGrid
  • jqxListMenu
  • jqxComplexInput
  • jqxTooltip
  • jqxRating
  • jqxDraw
  • jqxDataTable
  • jqxToolBar
  • jqxFormattedInput
  • jqxColorPicker
  • jqxRangeSelector
  • jqxDragDrop
  • jqxTreeMap
  • jqxComboBox
  • jqxNumberInput
  • jqxScrollView
  • jqxSlider
  • jqxPanel
  • jqxEditor
  • jqxDropDownList
  • jqxDateTimeInput
  • jqxProgressBar
  • jqxScrollBar
  • jqxValidator
  • jqxRibbon
  • jqxListBox
  • jqxCalendar
  • jqxFileUpload
  • jqxSplitter
  • jqxSplitLayout
  • jqxBarcode (NEW)
  • jqxQRcode (NEW)
  • jqxForm
  • jqxValidator
  • jqxLayout
  • jqxButtons
  • jqxKanban
  • jqxBulletChart
  • jqxDockingLayout
  • jqxTimePicker
  • jqxTimeline
  • jqxHeatMap

jqxCalendar

  • Default Functionality
  • Localization
  • Special Dates
  • Show Week of the Year
  • Restrict Date Range
  • Restricted Dates
  • Hide Other Month Days
  • Display Weekends Style
  • First Day of the Week
  • Range Selection
  • Disabled
  • Fluid Size
  • Events
  • Keyboard Navigation
  • Right to Left Layout
  • Two Way Data Binding
Theme:
Light
  • Demo
  • App.htm
  • App.Component.ts
  • App.Component.htm
  • App.Module.ts

Angular 7 Calendar

The Calendar component for Angular allows you to pick a date, add special dates or restricted dates. You can navigate through years, decades or centuries by clicking the calendar's title bar, display week numbers or customize the layout.

angular calendar

Angular 7 Calendar features



Week Number. It is possible to show the week number of the year in the first column on the left. In order to display the Week Number you have to set the showWeekNumbers property to true.

Special Dates. You can add any special date to the Angular Calendar by using the addSpecialDate method. An example for a special date is a national holiday.

Restricted Dates. The restricted dates are dates which cannot be selected.

Date Ranges. In order to select a date range you have to click on a start and the on an end date.

The Calendar enables localization of the content and dates in different languages and date formats.

In addition to that Calendar can also be enabled or disabled. When the Calendar is disabled it is not possible to choose dates.

Keyboard navigation and right-to-left layout.

jQWidgets
  • Facebook
  • Twitter
  • Demo
  • Download
  • Documentation
  • License and Pricing
  • Services
  • Forums
  • About
  • Terms of Use
  • Privacy Policy
  • Contact Us

jQWidgets © 2011-2025. All Rights Reserved.