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

[meribout]

Hello
Is there a solution for this problem??

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.