First I want to say that I've read many fixes, but noone have fixed my problem.
I'm using this library, https://github.com/amittkSharma/extended-datetimepicker, I need to call a function after my input gets updated.
Examples of how to use the clock can be found in this link, https://rawgit.com/amittkSharma/extended-datetimepicker/master/index.html, this is basically how I'm using the clocks, attaching them to an ng-model.
This library uses a directive, and opens a clock to pick time or date, I'm using it for the time part, I liked this clock very much, so I'm using it. But I cannot find a way to catch the onchange event for my input.
In the directive code there is this comment in line 134, //@TODO custom event to trigger input, which I thought I might add something there, I tried to add an element.on('change') function, but I didn't get it to work, so I'm out of ideas.
I'm using this library to load a bunch a times and make picking time easier. So I need a solution that works like inside on a ng-repeat, or something I can iterate.
Any help would be very much appreciatted.
EDIT
After the answer given by samura, I did some more investigation as to why it wasn't working on my $scope variable.
I didn't mention this, but my $scope variable is an array, and this was the problem (this is why you need to be as detailed as possible when your are asking a question). You need to add a 3rd parameter to watch for changes inside the array, you need to add true.
Like this:
$scope.$watch('timesArray', function() {
alert('hey, time has changed!');
}, true); //here the 3rd param
Taken from: How to deep watch an array in angularjs?
For this input
<input mdc-datetime-picker date="false" time="true" type="text" id="time" short-time="true"
placeholder="Time"
min-date="minDate"
format="hh:mm a"
ng-model="time">
You can use
$scope.$watch('time', function() {
alert('hey, time has changed!');
});
inside your controller to catch any change on the time property.