bootstrap-ui-datetime-picker change to 24hour format

Question

I use bootstrap-ui-datetime-picker in my angularjs app. But I can't get 24-hours format in time picker. After I select 6:00 PM in result I get 18:00 h. This is ok, but I also need same directly in picker. Here is code

<div class="form-group">
      <label class="col-sm-2 control-label">Both</label>
      <div class="col-sm-10">
        <p class="input-group">
            <input type="text" class="form-control" datetime-picker="MM/dd/yyyy HH:mm" ng-model="ctrl.date.value" is-open="ctrl.date.showFlag"/>
            <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-click="ctrl.date.showFlag = true"><i class="fa fa-calendar"></i></button>
            </span>
        </p>
      </div>
    </div>

app.controller('MyController', ['$scope', function($scope) {

var that = this;

this.date = {
value: new Date(),
showFlag: false
};

this.openCalendar = function(e, date) {
  that.open[date] = true;
};

}]);

Working plnkr with same problem Thank you

Answer 1

You need to parse a configuration object into timepicker-options attribute and set showMeridian: false. This disables the AM/PM mode and enables 24h mode.

View

<div ng-controller="MyCtrl as ctrl">
  <input type="text" 
         class="form-control" 
         datetime-picker="MM/dd/yyyy HH:mm" 
         timepicker-options="ctrl.datePickerOptions"
         ng-model="ctrl.date.value" is-open="ctrl.date.showFlag" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default" ng-click="ctrl.date.showFlag = true">
      Open picker
    </button>
  </span>
</div>

AngularJS application

var myApp = angular.module('myApp', ['ui.bootstrap', 'ui.bootstrap.datetimepicker']);

myApp.controller('MyCtrl', function($scope) {
  var that = this;

  this.datePickerOptions = {
    showMeridian: false
  }

  this.date = {
    value: new Date(),
    showFlag: false
  };

  this.openCalendar = function(e, date) {
    that.open[date] = true;
  };
});

> demo fiddle