Nativescript: DatePicker: binding to ngModel does not work on iOS

[otaran]

Please, provide the details below:

Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo?

Yes, there is a similar issue #4499, but it is reported for Android, whereas my issue is reproducible only on iOS.

Tell us about the problem

You can't use [ngModel] binding in DatePicker, it throws error TypeError: null is not an object (evaluating 'value.getFullYear') and ignores bound date.

Which platform(s) does your issue occur on?

iOS

Please provide the following version numbers that your issue occurs with:

• CLI: 3.1.3
• Cross-platform modules: 3.1.1
• Runtime(s): 3.1.0
• Plugin(s): N/A.

Please tell us how to recreate the issue in as much detail as possible.

1. Create new Angular project.
2. Add <DatePicker [ngModel]="date"></DatePicker> to some component template.
3. Init date property of that component with new Date('2015-05-05').
4. Import NativeScriptFormsModule to AppModule.
5. ./node_modules/.bin/tns run ios

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

See attached sample project. The first DatePicker will have the correct date (because it is using [date] binding), the second DatePicker will have an incorrect date (because of [ngModel]).

[NickIliev]

Hello @otaran and thank you for reporting this issue. I can confirm that indeed the ngModel binding is not working as expected for date property on iOS.

Steps to reproduce the issue - use this demo app

As a workaround, you can use the extended syntax for the dateChange event.
e.g.

<DatePicker [date]="date" (dateChange)="onDateChanged($event)"></DatePicker>

and in the coomponent file

onDateChanged(args) {
    console.dir(args);
}

[tsonevn]

This issue was moved to NativeScript/nativescript-angular#963

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.