forked from ng-bootstrap/ng-bootstrap
/
datepicker-hebrew.html
26 lines (20 loc) · 1.06 KB
/
datepicker-hebrew.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<p>
The Hebrew or Jewish calendar is a lunisolar calendar.
In Israel it is used for religious purposes and frequently as an official calendar for civil purposes.
</p>
<ngb-datepicker class="hebrew rtl" #dp [(ngModel)]="model" [displayMonths]="1" [firstDayOfWeek]="7" [dayTemplate]="dt"
[dayTemplateData]="dayTemplateData">
</ngb-datepicker>
<ng-template #dt let-date let-data="data" let-selected="selected" let-currentMonth="currentMonth" let-focused="focused">
<div class="hebrew-day" [class.outside]="date.month !== currentMonth" [class.selected]="selected"
[class.active]="focused"
[class.btn-light]="focused && !selected">
<div class="gregorian-num">{{ data.gregorian.day + '/' + (data.gregorian.month) }}</div>
<div class="hebrew-num">{{ i18n.getDayNumerals(date) }}</div>
</div>
</ng-template>
<hr/>
<button class="btn btn-sm btn-outline-primary mr-2" (click)="selectToday()">Select Today</button>
<button class="btn btn-sm btn-outline-primary mr-2" (click)="dp.navigateTo()">To current month</button>
<hr/>
<pre>Model: {{ model | json }}</pre>