Setting the current time as default and updating the value


I am currently using the ionic-timepicker plugin to create a time picker for my Ionic application.

Unfortunately, I am having issues setting the current time as default and updating the value when the user makes a selection.

How can I figure out what is wrong?

enter image description here


  $scope.appointmentTime = ((new Date()).getHours() * 60 * 60);

  $scope.timePickerObject = {
    inputEpochTime: ((new Date()).getHours() * 60 * 60), //Optional
    step: 15, //Optional
    format: 12, //Optional
    titleLabel: '12-hour Format', //Optional
    setLabel: 'Set', //Optional
    closeLabel: 'Close', //Optional
    setButtonType: 'button-positive', //Optional
    closeButtonType: 'button-stable', //Optional
    callback: function(val) { //Mandatory

  function timePickerCallback(val) {
    if (val) {
      $scope.timePickerObject.inputEpochTime = val;


<ionic-timepicker input-obj="timePickerObject">
  <button class="button button-block button-positive overflowShow" style="margin-top: 0px; margin-bottom: 0px">
    <standard-time-meridian etime='timePickerObject.appointmentTime'></standard-time-meridian>


Have you included in your code ‘standardTimeMeridian’ directive?

And then the attribute etime has to be bound to ‘timePickerObject.inputEpochTime’ not timePickerObject.appointmentTime which is not defined.

Here is a working example:

Answered By – beaver

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published