title: AngularJS & UI Bootstrap(DatePicker) - After date selection, the ngModel will not keep the UTC timestamp
body: <p>Using:</p>
  
  <ul>
  <li>UI Bootstrap datePicker component (ver. 0.13.4)</li>
  <li>AngularJS (ver 1.4.5)</li>
  </ul>
  
  <p>I'm trying to format the binded ngModel value of the user selected date, so I can pass the value as a UTC timestap via $http</p>
  
  <p>Here is my HTML   </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
    &lt;head&gt;
      &lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="ui-bootstrap-tpls-0.13.4.js"&gt;&lt;/script&gt;
      &lt;script src="app.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
  
    &lt;body ng-app="formApp" ng-controller="formController"&gt;
  
      &lt;p&gt;Selected date is: {{ formData.dt | date:'fullDate' }}&lt;/p&gt;
      &lt;p&gt;The binded ngModel is: {{ formData.dt }}&lt;/p&gt;
  
      &lt;div style="display:inline-block; min-height:290px;"&gt;
          &lt;datepicker 
              ng-model="formData.dt"
              min-date="minDate"
              max-date="maxDate" 
              show-weeks="false"
              starting-day = "1"
              class=""&gt;
          &lt;/datepicker&gt;
      &lt;/div&gt;
  
    &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>here is the Controller</p>
  
  <pre><code>var app = angular.module('formApp', ['ui.bootstrap'])
  
  app.controller('formController', function($scope, $http) {
  
    $scope.formData = {};
  
    var date = new Date();
    $scope.formData.dt = date.getTime();
  
  });
  </code></pre>
  
  <p>and here is a Plunker demo - <a href="http://plnkr.co/edit/3vKIO3187ZC2FAnlw2ZW?p=preview" rel="nofollow">http://plnkr.co/edit/3vKIO3187ZC2FAnlw2ZW?p=preview</a></p>
  
  <p>As you will see, selecting any date in the picker changes the model format.
  How can I set it so when any date is selected, it still has a UTC value?</p>