Skip to content

Version 0.4.3 is tagged on GitHub and is not published on npm. A beta will be published before the stable 1.0.0.

ngx-mat-hijri-adapter

Calendar toggle

A #calendarToggle template replaces the whole toggle. The stored CalendarDate stays in valueCalendar.

Why the stored value stays

The ready-made fields store a CalendarDate, which keeps its own calendar. The toggle changes only the calendar on screen, so a Gregorian field can show 1/9/1445 and still hold Gregorian 2024-03-11. The control is not marked dirty.

Custom template

Put one ng-template with the reference #calendarToggle inside the field. let-controller receives display, valueCalendar, labels, disabled, show, and open. show switches the calendar and leaves the picker closed. open switches it and opens the picker. The calendarToggle attribute is optional next to this template. equivalentHint still shows under the field.

Live template

The icon shows the calendar on screen and opens a menu. Choosing a calendar calls controller.open. The line under the field is the stored value, which stays Gregorian.

ngx-mat-hijri-adapter/signals