I need to set date and time (12 hours 0 minutes) via Angular UI DatePicker Popup.plunkerI had two issues:1. When page was loaded:Input had value 17-March-2017 12:00:00.000. It's right.But Selected date was: 2017-03-17T14:57:51.080Z. It's not true, not 12:00.2. When I changed date via button:Input view was 24-March-2017 12:00:00.000Selected date was: 2017-03-24T09:00:00.000ZI solved both issues this way:I added defTime directive with formatters and parsers for input element;I added time service to set 12 hours. If I use ng-model-options={timezone: 'utc'} attribute in input, I don't need to subtract TimezoneOffset from Date differently for view (formatter) and model (parser) (Compare plunker ver.1 and ver.2).In ver.1 (without ng-model-options attribute):subtracting TimezoneOffset hours for $parsers;subtracting 0 hours for $formatters.Could you offer a better solution? Thanks.var app = angular.module('ui.bootstrap.demo', ['ui.bootstrap']);app.controller('DatepickerPopupDemoCtrl', function ($scope, time) {  $scope.dt = time.getDefault(new Date());});app.directive('defTime', function (time) {  return {    restrict: 'A',    require: 'ngModel',    link: function (scope, element, attrs, ngModel) {      ngModel.$parsers.push(time.getDefault);      ngModel.$formatters.push(time.getDefault);    }  }});app.service('time', function () {  return {    getDefault: getDefault  }  function getDefault(dateObj){  var tzOffset = new Date().getTimezoneOffset() / 60;  var hoursTZ = 12 - tzOffset;  return new Date(new Date(dateObj).setHours(hoursTZ, 0, 0, 0));}});<link href=//netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css rel=stylesheet/><script src=//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js></script><script src=//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js></script><div ng-app=ui.bootstrap.demo>  <div ng-controller=DatepickerPopupDemoCtrl>    <pre>Selected date is: <em>{{dt}}</em></pre>      <h4>Popup</h4>    <div class=row>      <div class=col-md-6>        <p class=input-group>          <input def-time                type=text                 class=form-control                 uib-datepicker-popup=dd-MMMM-yyyy HH:mm:ss.sss                ng-model-options={timezone: 'utc'}                ng-model=dt                 is-open=opened/>          <span class=input-group-btn>            <button type=button class=btn btn-default ng-click=opened = !opened>              <i class=glyphicon glyphicon-calendar></i>            </button>          </span>        </p>      </div>    </div>  </div></div>
Angular UI Datepicker Popup with Default Time
javascript;angular.js;angular bootstrap