ion-datetime value doesnt change when ngModel is changed

[keithdmoore]

When you have a select on the page that selects the ngModel, the value for the ngModel in ion-datetime does not change to reflect the selection change.

I was expecting the value to change since the model has changed. Basically, I expect the ion-datetime component to behave like other ion-inputs.

Steps to reproduce:

1. Default the model to a value
2. Select a date/time
3. Change the model using a select.
4. Note that the value in the ion-datetime doesnt change.

  <ion-item>
      <ion-label stacked>Item Number</ion-label>
      <ion-select [(ngModel)]="currentItem">
        <ion-option *ngFor="let item of myItems" [value]="item">{{ item.itemNumber }}</ion-option>
      </ion-select>
      </ion-item>  
  <ion-item>
    <ion-label stacked>Item description</ion-label>
    <ion-input [(ngModel)]="currentItem.desc"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label stacked>Date</ion-label>
    <ion-datetime displayFormat="MMM DD, YYYY HH:mm" [(ngModel)]="currentItem.itemDate"></ion-datetime>
  </ion-item> 

Occurs in: Ionic2

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

Cordova CLI: 6.1.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.7
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
ios-deploy version: 1.8.5
ios-sim version: 3.1.1
OS: Mac OS X El Capitan
Node Version: v5.8.0
Xcode version: Xcode 7.3.1 Build version 7D1014

[emeryao]

I think this issue is related to the type of the model that bind to ion-datetime.
It works fine for me when I bind a string value (such as '2016-05-26T09:16:57.528Z') to a ion-datetime, but won't work if I bind a date value (such as new Date())

hope that may help you @keithdmoore

[keithdmoore]

@adamdbradley Can you fix this?

[keithdmoore]

@emeryao Thanks for the potential workaround. The date does get set in the model but when I change the model to point to a different item in the array, the date is not cleared in the input.

[emeryao]

@keithdmoore
I think I solved this issue for the plunker you provided with the code below:

myItems: Object = [
    {itemNumber:1, desc:"item1 desc", itemDate:(new Date()).toISOString()},
    {itemNumber:2, desc:"item2 desc",itemDate:(new Date()).toISOString()},
    {itemNumber:3, desc:"item3 desc",itemDate:(new Date()).toISOString()}
  ];

I think the initial value of the itemDate should not be null .
I have also tried the value of empty string '' for itemDate as initial value and won't work either.

hope that may help you 😃

[ChrisProlls]

Like @emeryao said

It works fine for me when I bind a string value (such as '2016-05-26T09:16:57.528Z') to a ion-datetime, but won't work if I bind a date value (such as new Date())

In my ngModel, I put a Date value, and the component is not updated correctly. Is that normal ?
cc @adamdbradley