Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Input type time with angular.js

According to the Docs input[time]: https://docs.angularjs.org/api/ng/input/input%5Btime%5D

it should be enough to use the input type time and bind it to a date oject, however it doesn't work as I'd expect it.

<input ng-model="time" type="time" placeholder="HH:mm" min="08:00" max="17:00" required >

and

$scope.time = new Date();

as a Result I'd like to see just the HH:mm within the input field.

Here's a jsfiddle to play around:

http://jsfiddle.net/U3pVM/7314/

like image 539
Alx Avatar asked Jul 27 '14 19:07

Alx


People also ask

How to input time in Angular?

You can also use interpolation inside this attribute (e.g. min="{{minTime | date:'HH:mm:ss'}}" ). Note that min will also add native HTML5 constraint validation. Sets the max validation error key if the value entered is greater than max . This must be a valid ISO time format (HH:mm:ss).

What is the input type for time?

The <input type="time"> defines a control for entering a time (no time zone).

How do you get AM PM from input type time?

If you want the time with AM & PM, check the first two values, and utilize something like the following: if(FirstTwoNums > 12){ FirstTwoNums -= 12; PM = true;}/*else, PM is false */ .


1 Answers

I think you need at least Angular 1.3.0 beta for this to work, as it looks like it was introduced then.

Changelog:

...

Features

input: support types date, time, datetime-local, month, week (46bd6dc8, #5864)
....

like image 135
Matsemann Avatar answered Nov 01 '22 20:11

Matsemann