feat(datepicker): add 'currentYear' to the day template (#3540)

Fixes #2944
ng-bootstrap · Jan 10, 2020 · bbd8b51 · bbd8b51
1 parent 8016a22
commit bbd8b51
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 1 deletion.
diff --git a/src/datepicker/datepicker-day-template-context.ts b/src/datepicker/datepicker-day-template-context.ts
@@ -19,6 +19,11 @@ export interface DayTemplateContext {
    */
   currentMonth: number;
 
+  /**
+   * The year currently displayed by the datepicker.
+   */
+  currentYear: number;
+
   /**
    * Any data you pass using the `[dayTemplateData]` input in the datepicker.
    *

diff --git a/src/datepicker/datepicker-month-view.spec.ts b/src/datepicker/datepicker-month-view.spec.ts
@@ -187,6 +187,7 @@ class TestComponent {
             date: new NgbDate(2016, 7, 4),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 7, 4),
               date: new NgbDate(2016, 7, 4),
               disabled: false,
@@ -202,6 +203,7 @@ class TestComponent {
             date: new NgbDate(2016, 8, 1),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 8, 1),
               date: new NgbDate(2016, 8, 1),
               disabled: false,
@@ -224,6 +226,7 @@ class TestComponent {
             date: new NgbDate(2016, 8, 2),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 8, 2),
               date: new NgbDate(2016, 8, 2),
               disabled: true,
@@ -239,6 +242,7 @@ class TestComponent {
             date: new NgbDate(2016, 8, 3),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 8, 3),
               date: new NgbDate(2016, 8, 3),
               disabled: false,
@@ -261,6 +265,7 @@ class TestComponent {
             date: new NgbDate(2016, 8, 4),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 8, 4),
               date: new NgbDate(2016, 8, 4),
               disabled: false,
@@ -276,6 +281,7 @@ class TestComponent {
             date: new NgbDate(2016, 9, 1),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 9, 1),
               date: new NgbDate(2016, 9, 1),
               disabled: false,
@@ -298,6 +304,7 @@ class TestComponent {
             date: new NgbDate(2016, 9, 2),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 9, 2),
               date: new NgbDate(2016, 9, 2),
               disabled: false,
@@ -313,6 +320,7 @@ class TestComponent {
             date: new NgbDate(2016, 9, 3),
             context: {
               currentMonth: 8,
+              currentYear: 2016,
               $implicit: new NgbDate(2016, 9, 3),
               date: new NgbDate(2016, 9, 3),
               disabled: false,

diff --git a/src/datepicker/datepicker-service.spec.ts b/src/datepicker/datepicker-service.spec.ts
@@ -1295,6 +1295,14 @@ describe('ngb-datepicker-service', () => {
       expect(getDayCtx(0).currentMonth).toBe(10);
     });
 
+    it(`should generate 'currentYear' for day template`, () => {
+      service.focus(new NgbDate(2017, 1, 1));
+      expect(getDayCtx(0).currentYear).toBe(2017);
+
+      service.focus(new NgbDate(2018, 1, 1));
+      expect(getDayCtx(0).currentYear).toBe(2018);
+    });
+
     it(`should update 'focused' flag and tabindex for day template`, () => {
       // off
       const date = new NgbDate(2017, 5, 1);

diff --git a/src/datepicker/datepicker-tools.ts b/src/datepicker/datepicker-tools.ts
@@ -193,7 +193,8 @@ export function buildMonth(
         $implicit: newDate,
         date: newDate,
         data: contextUserData,
-        currentMonth: month.number, disabled,
+        currentMonth: month.number,
+        currentYear: month.year, disabled,
         focused: false,
         selected: false, today
       });