How to update date diff automatically

Question

i'm trying to show the difference between now and a date using moment into my ionic app.

This is what i'm trying:

controller

this.getElapsedTime = function(){
    return moment(moment(new Date()).diff(moment(this.user.date))).format("HH:mm:ss");
};

view

<span class="footer-title">Tempo trascorso: {{myCtrl.getElapsedTime()}}</span>

My problem is that date will automatically update view just for a second and then it doesn't change.

How can i tell to angular to update always the view?

Aside: Your moment code can be simplified to `moment.utc(moment().diff(this.user.date)).format("HH:mm:ss")`. Also, you should read [this answer](http://stackoverflow.com/a/18624295/634824) about how to correctly format durations if they might go over 24 hours. — Matt Johnson-Pint, Jan 13 '16 at 03:48

score 1 · Accepted Answer · answered Jan 12 '16 at 07:01

I don't recommend relying on Angular bindings to change something so frequently, because the only way for them to update is to do a full digest, which can kill performance if you do it too often.

Instead, create a directive that takes in a date value and then directly manipulates the element's innerHTML to update the time remaining in a setInterval() function.

Don't forget to cancel the interval in the $destroy scope event to prevent memory leaks.

How to update date diff automatically

1 Answers1