5

I having troubles using the angular 5 calendar component https://mattlewis92.github.io/angular-calendar

The calendar renders perfectly, including events etc. However, Using mwlCalendarPreviousView and mwlCalendarNextView directives do not work.

Clicking on then do give the following error:

ERROR TypeError: subFn is not a function
    at CalendarPreviousViewDirective.onClick (angular-calendar.js:239)
    at Object.eval [as handleEvent] (PlanningOverview.html:58)
    at handleEvent (core.js:13581)
    at callWithDebugContext (core.js:15090)
    at Object.debugHandleEvent [as handleEvent] (core.js:14677)

Navigating to the source of that onClick method shows me the following:

 /**
  * @hidden
  * @return {?}
  */
  CalendarNextViewDirective.prototype.onClick = function () {
        var /** @type {?} */ addFn = {
            day: addDays,
            week: addWeeks,
            month: addMonths
        }[this.view];
        this.viewDateChange.emit(addFn(this.viewDate, 1));
    };
    return CalendarNextViewDirective;

Which shows that subFn is indeed not a function.

I must be doing something wrong, but I can't find what...

(I'm using angular-calendar 0.23.2 on Angular 5.0.00)

Pieter Degraeuwe
  • 532
  • 6
  • 17
  • I don't understand the question. You've shown that the code has bug. You've found it and stated it. What do you want to do now? – Lazar Ljubenović Jan 12 '18 at 10:02
  • I'm using the angular-calender library in my angular app. So am I using the directives of that library. The clicking on the directives do give an error. On the demo site, the directives do work. – Pieter Degraeuwe Jan 12 '18 at 10:03
  • And the library has a bug. You've found it. Without changing the library code, you cannot do anything. – Lazar Ljubenović Jan 12 '18 at 10:05
  • 1
    The library seems to work perfectly on their demo site. That's why I think it's something on my end... – Pieter Degraeuwe Jan 12 '18 at 11:01
  • For the record, the solution is really simple: the above code shows that `addFn` will result in a function if this.view resolves to either `'day'`, `'week'` or `'month'`. In my case, just adding this field as a string in my component, and initializing it with the value `'month'` solved my problem. – candide Mar 29 '18 at 08:07

2 Answers2

5

I had the same issue using Angular 6 and angular-calendar 0.25.2. I was setting the [view] attribute incorrectly. I had [view]="month", but the [view] MUST be set to a variable in the controller, e.g. in the HTML: [view]='myView' and in the controller myView: string = 'month'

deanwilliammills
  • 2,617
  • 2
  • 21
  • 27
1

[view]="month" change to view="month"

Rahul Uttarkar
  • 3,367
  • 3
  • 35
  • 40