0

I have the following:

JS

$scope.at = {time:""};

HTML

<input type="time" ng-model="at.time" ng-change="abc()" />
<div>{{ at.time | date: "HH:mm" }}</div>

Here is an example output:

Input: 4:10 PM
DIV:   16:10

My goal is to make the input also show 16:10 or whatever time in military time of whatever is eventually selected. I've tried using ng-change and while it does change my div, it does not change the value of my input box.

Any help would be greatly appreciated.

Just as a note, the time is being picked on mobile like so: enter image description here

bryan
  • 8,879
  • 18
  • 83
  • 166
  • What is in the function abc()? – Ray Suelzer Aug 08 '17 at 20:27
  • @RaySuelzer Nothing. Because `ng-change` doesn't work on the input box – bryan Aug 08 '17 at 20:39
  • Look into model formatters https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#$formatters. This will allow you to modify the `$viewValue` of the input while retaining the `$modelValue` of it – Chris Traveis Aug 08 '17 at 20:39
  • check this out. maybe helps https://stackoverflow.com/a/13523302/8303694 – Jesus Carrasco Aug 08 '17 at 22:38
  • @JesusCarrasco this is just noting that each browser shows the time property differently. I'm looking for an angular solution to just modify the model output – bryan Aug 09 '17 at 01:24
  • Well always can do with custom directive to extend or modify viewvalue, perhaps actually input type time like the link says is still new and not all browsers support it, i think you can use also ui.timepicker from ui-bootstrap. Hope helps. – Jesus Carrasco Aug 09 '17 at 04:59

0 Answers0