I followed the instruction above. but still not getting the selected time. Same to the codes in github repo. Please help me.
If you followed all the instructions as it is, then you should get it for sure. There could be something missing in your code. Could you please share your code snippet?
$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
timePickerCallback(val);
}
};
function timePickerCallback(val) {
if (typeof (val) === 'undefined') {
console.log('Time not selected');
} else {
var selectedTime = new Date(val * 1000);
console.log('Selected epoch is : ', val, 'and the time is ', selectedTime.getUTCHours(), ':', selectedTime.getUTCMinutes(), 'in UTC');
}
}app.directive(āstandardTimeMeridianā, function() {
return {
restrict: āAEā,
replace: true,
scope: {
etime: ā=etimeā
},
template: ā{{stime}}ā,
link: function(scope, elem, attrs) {
scope.stime = epochParser(scope.etime, 'time');
function prependZero(param) {
if (String(param).length < 2) {
return "0" + String(param);
}
return param;
}
function epochParser(val, opType) {
if (val === null) {
return "00:00";
} else {
var meridian = ['AM', 'PM'];
if (opType === 'time') {
var hours = parseInt(val / 3600);
var minutes = (val / 60) % 60;
var hoursRes = hours > 12 ? (hours - 12) : hours;
var currentMeridian = meridian[parseInt(hours / 12)];
return (prependZero(hoursRes) + ":" + prependZero(minutes) + " " + currentMeridian);
}
}
}
scope.$watch('etime', function(newValue, oldValue) {
scope.stime = epochParser(scope.etime, 'time');
});
}
};
})Could you please post the HTML code also. Also please cross check whether the html and the controller are associated or not.
<div class="card"> <label class="item item-input"> <input type="text" placeholder="Pick date" ng-model="datepicker" name="datepicker" ng-click="opendateModal()" readonly> </label> <ionic-timepicker input-obj="timePickerObject"> <button class="button button-stable button-block"> <standard-time-meridian etime='epochTime'></standard-time-meridian> </button> </ionic-timepicker> </div>
They are associated and it seems there is no problem with that. I donāt know whereās my error now.
How do i get AM/PM in 12 hr format and if i have selected 12:00 or 11:01 in existing time picker value getting like 12:0 or 11:1ā¦
It returns the epoch value, which you can use.
Hi All, a new version of ionic-timepicker v0.5.0 has ben releases with new features. If anyone want to use ionic-timepicker please use this new version.
Hi,
Thank you for your time picker! I am wondering if it is possible to limit the time selection e.g only able to select from 9am to 12pm? Thank you so much for your help!
1 Like
Restricting the time is not possible with this version of component.
+1 for restricting time. Otherwise itās a great plugin.
Hello,
I am facing issue with date-picker, when i open date picker in device it will automatically open year select box in both android and ios, can you tell me what i am doing wrong.
$scope.datePickerOption = {
callback: function (val) {
$scope.scheduleObj.dateString = moment(val).format("MMM D, YYYY");
$scope.scheduleObj.date = val;
}
};
$scope.openDatePickerFromDate = function(){
if($scope.scheduleObj && $scope.scheduleObj.date){
$scope.datePickerOption["inputDate"] = new Date($scope.scheduleObj.date);
}
var returnVal = ionicDatePicker.openDatePicker($scope.datePickerOption);
};
Please try the demo link. i tested in multiple devices, but it is working fine. Also please check the events or functions you are calling inside your code.
Hi, I used to love this time picker and used it for a while, but after facing several issues and wanting to improve on the user experience, Iāve created a new component which has more of a native feel to.
If anyone is interested, it can be seen at:
Hope this helps,
Thanks
Hello,
The timepicker is showing me a different time as my actual Epochtime, when i have an epoch time value passed to the object on inputTime the timepicker will show me the Epochtime +1hr (which corresponds with my local timezone),
for example when i pass Epochtime 52200 it should display 14:30, but the timepicker displays 15:30,
if i use the timepicker to set the time to 14:30 it also retuns the value 52200, but the popup display always opens with +1 hr
@rajeshwarpatlolla you mentioned that the timepicker does not use local time but UTC time, in my case it does convert to local time zone, how do i disable this?
@rajeshwarpatlolla is it possible to support āscrollingā of the time fields? I would like to have increments of 1 and let the user set the value by scrolling up or down( touch users on mobile phones) currently the user has to click many times to get an exact value. for my application the precision of 1 minute is important so I cannot up the stepssize
i think it is because we use getUTCHour(). in my case also it displays +1 hour.
same problem with me.
try remove inputTime and try.
suppose now time is 2:30 so datepicker will display 3:30.
Donāt know why. 
Hi Everyone, i am trying to list all the ionic framework plugins in a single location. I had spent lot of time in getting all these plugins into one location, which hopefully should save so much of time of people who like to find one. I thought it would be helpful for the people, who wants to see the list of ionic plugins at one location. I have added as many as i can. If you feel that i missed any plugin, please feel free to make a PR or raise an issue with the details of the plugin.
Here you can find the list of all ionic plugins