Primeng: Calendar with selectionMode="multiple" show error when the array (ngModel) has value(s)

[sgodoy]

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)

http://plnkr.co/edit/vG1QBJQuTVyEbhQRyM7s?p=preview

Current behavior
When the dates array (ngModel ) has default values or dates are pushed in another method, dev console show this error message:

ERROR Error: Uncaught (in promise): TypeError: val.getMonth is not a function
Calendar.prototype.updateUI@https://unpkg.com/[email protected]/components/calendar/calendar.js:757:26
Calendar.prototype.writeValue@https://unpkg.com/[email protected]/components/calendar/calendar.js:796:9
setUpControl/<@https://unpkg.com/@angular/forms@4.2.6/bundles/forms.umd.js:1810:9
FormControl.prototype.setValue/<@https://unpkg.com/@angular/forms@4.2.6/bundles/forms.umd.js:2996:65
FormControl.prototype.setValue@https://unpkg.com/@angular/[email protected]/bundles/forms.umd.js:2996:13
NgModel.prototype._updateValue/<@https://unpkg.com/@angular/forms@4.2.6/bundles/forms.umd.js:4398:46
ZoneDelegate.prototype.invoke@https://unpkg.com/zone.[email protected]?main=browser:365:17
onInvoke@https://unpkg.com/@angular/[email protected]/bundles/core.umd.js:3922:24
ZoneDelegate.prototype.invoke@https://unpkg.com/zone.[email protected]?main=browser:364:17
Zone.prototype.run@https://unpkg.com/zone.[email protected]?main=browser:125:24
scheduleResolveOrReject/<@https://unpkg.com/[email protected]?main=browser:760:52
ZoneDelegate.prototype.invokeTask@https://unpkg.com/zone.[email protected]?main=browser:398:17
onInvokeTask@https://unpkg.com/@angular/[email protected]/bundles/core.umd.js:3913:24
ZoneDelegate.prototype.invokeTask@https://unpkg.com/zone.[email protected]?main=browser:397:17
Zone.prototype.runTask@https://unpkg.com/zone.[email protected]?main=browser:165:28
drainMicroTaskQueue@https://unpkg.com/zone.[email protected]?main=browser:593:25
ZoneTask/this.invoke@https://unpkg.com/zone.[email protected]?main=browser:464:25

Apilar seguimientos:
onInvokeTask@https://unpkg.com/@angular/[email protected]/bundles/core.umd.js:3913:24 [angular]
ZoneTask/this.invoke@https://unpkg.com/zone.[email protected]?main=browser:464:25 []

Expected behavior
The calendar must get the array, set the dates and not display the error.

Minimal reproduction of the problem with instructions

http://plnkr.co/edit/vG1QBJQuTVyEbhQRyM7s?p=preview
-Just press add Date button.

What is the motivation / use case for changing the behavior?
It crashes when the ngModel have default dates.

Please tell us about your environment:

Windows 7, Visual Studio Code.

• Angular version: 2.0.X
  ^4.0.0

• PrimeNG version: 2.0.X
  ^4.2.0-rc.1

• Browser:
  Chrome 60.0.3112.113 (64 bits)
  Firefox 55.0.3 (32-bit)

• Language: TypeScript ~2.3.3

• Node (for AoT issues): node --version = 8.2.1

[sgodoy]

Workaround
Not sure if this is the optimal solution, but the error is not displaying with this fix:

calendar.js (755)

Calendar.prototype.updateUI = function () {
        var val = this.value || this.defaultDate || new Date();

>         if(Array.isArray(val)){
>             if(val.length>0) this.createMonth(val[0].getMonth(), val[0].getFullYear());
>         }else{
>             this.createMonth(val.getMonth(), val.getFullYear());
>         }

        if (this.showTime || this.timeOnly) {
            var hours = val.getHours();
            if (this.hourFormat == '12') {
                if (hours >= 12) {
                    this.currentHour = (hours == 12) ? 12 : hours - 12;
                }
                else {
                    this.currentHour = (hours == 0) ? 12 : hours;
                }
            }
            else {
                this.currentHour = val.getHours();
            }
            this.currentMinute = val.getMinutes();
            this.currentSecond = val.getSeconds();
        }
    };

[quaderi]

I ran into the same issue except with selectionMode of "range" instead of "multiple". Just submitted a very similar pull request to get rid of this bug.

[cagataycivici]

Tracked at 3996