1

I want a timer of 1 minute which should stop as soon as it reaches 1 minute and should call a function then. I am using angular-timer directive for this.

The code I am using in html is

<timer end-time="60000">
    {{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.
</timer>

I am providing end time as 60000 milliseconds(1 minute) in the attribute 'end-time'. But it is not working. When end time value is '1451628000000', then it works. Where I am going wrong ? Also help me with how to call a function when the timer finished.

Thanks in advance.

2
  • 1
    6000 milliseconds is 6 seconds, not 1 minute. Commented Dec 12, 2015 at 17:05
  • @Amir My mistake. But for 6 seconds also, its not working Commented Dec 12, 2015 at 17:09

5 Answers 5

1

end-time parameter takes timestamp in milliseconds. Your 60000 is taken as timestamp. So it is already stopped.

What you can do is to compute now's timestamp and add 60000 more for adjustments.

In your controller:

$scope.endTime = (new Date()).getTime()+60*1000;

In the view:

<timer end-time="{{endTime}}">{{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.</timer>

I'm not exactly sure in which format you need to display that timer, but for what you have asked, this will do.

To run a function after specific period of time, simply use $timeout service inside your controller. Inject $timeout and use it like setTimeout function in JS.

$timeout(function () {
    console.log('this will run after 1 minutes');
}, 60*1000);

For more info, check out $timeouts documentation.

Sign up to request clarification or add additional context in comments.

Comments

1

You could also use count down time as follows.

The countdown timer

<timer interval="1000" countdown="100">{{countdown}}</timer>

will start its countdown from 100 until it reaches 0 by ticking every second

This markup will display countdown time in minute and seconds only. This attribute can be applied to regular clock timer as well.

<timer countdown="10041" max-time-unit="'minute'" interval="1000">
     {{mminutes}} minute{{minutesS}}, {{sseconds}} second{{secondsS}}
</timer>

A countdown timer that updates a value once the callback is reached

<timer countdown="3" interval="1000" finish-callback="callbackTimer.finished()">
    {{seconds}} second{{secondsS}}
</timer>

Comments

0

Your mistake is simple, and very easy to fix. JavaScript always uses time in milliseconds so 6000 eqauls to 6 seconds. It should work if you try this:

<timer end-time="60000">{{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.</timer>

Comments

0

Following the Angular-Timer docs here, you should use a combination of interval, countdown and finish-callback to achieve your use case.

countdown - start at this number and countdown to 0

interval - interval for which your screen will be updated. So if you use interval as 1000, it will refresh every second (roughly)

finish-callback - to call a function after the countdown is complete.

<timer countdown="60" interval="1000" 
       finish-callback="myFinishCallback()">
   {{seconds}} second{{secondsS}}
</timer>

Comments

0

Rather than using the timer in the html tag which is a attribute its better to use in the angularjs like $timeout(callAtTimeout, 60000);, then when you can call the method callAtTimeOut() which can do your work simple. If better you can add a watch if you don't know the exact timing where the ajax call for the request will happen

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.