A time picker for Ionic framework applications

I have built a ionic-timepicker bower component for Ionic frame work, which supports both 12-hour and 24-hour format, with 15 and one minute increment / decrement. No additional plugins required.

Check out the below links

View project @ Github

View Demo

You can have a look at the ionic-datepicker bower component which i have created.

18 Likes

Would be nice to get only necessary sources instead of a demo project.

like calling bower install ioniciTimePicker and get the timepicker with dependencies.
And please remove your webstorm project folder from the repo. it is the “.idea” folder.
Set it on your .gitignore file

Thanks

Hey bengtler,
Thanks for the suggestion.

would be awesome with a screenshot. Does it support intervals?

Hey crissi,

Yes, it supports intervals. All you need to do is, in side the object you need to specify the time interval.

1 Like

Annnnd does it have 24h support :wink:

1 Like

@bengtler, as of now it doesn’t have 24 hour support. I can modify it, so that it will also support 24 hour format.

2 Likes

Do it do it do it :wink: please.
Maybe you can provide also a date picker functionality?

So you make a IonicDateTimePicker.
1 module with 2 directives:

  • timepicker
  • datepicker
    and translations support!
    like passing translations to the directive for Months, Days, Cancel and Set button labels

same layout same repo

I think many buddies will kiss your feet ;).

4 Likes

Love the looks of this, thank you!

I’ve been struggling with time pickers recently.

Cheers
-Chris

@bengtler, i am trying to make the time picker for 24 hour format too. Once i am done with it, let me think about the date picker. Your idea is really cool.

1 Like

it is looking good :slight_smile:
Date Picker also would be very interesting !

Cheers!

1 Like

@pjusto, I am planning for that.

1 Like

24 hour support has been added.

2 Likes

it can return the time as string? Example just ‘13:30’ ?

thank you for your great work!

1 Like

No, it only returns the epoch time, you can easily convert epoch time in to any date format in angular/ionic.
Hope the following link will be useful.
https://docs.angularjs.org/api/ng/filter/date

Hi @bengtler,
I have converted the whole functionality into one directive, which supports both 12-hour and 24-hour formats.

1 Like

@rajeshwarpatlolla, nice work! Are you going to register your time picker for public avaliability to use it as a dependency in bower? (As described in http://bower.io/docs/creating-packages/)

@leoliteck, i am planning to register this time picker as a bower component, so that any one can use it.

Amazing! Thanks, will be great even as datapicker, not just for time :smile:

1 Like

Good work, nicely done