AngularJS. Clear $timeout when invoking angular-ui modal

Question

I have several $timeout expressions in Modal controller

App.controller('ModalCtrl', function ($scope, $timeout) {
    for (var i = 0; i < 10; i++) {
        (function () {
            var timer = $timeout(function () {
                console.log('timer')
            }, 1000);
        })()
    }
})

I need to clear all the timers when invoking the modal:

App.controller('MainCtrl', function ($scope, $modal, $timeout) {
    $scope.showMap = function () {
        var modal = $modal.open({
            templateUrl: 'modalap.html',
            controller: 'modalCtrl',
        })

        modal.result.then(function () { //fires when modal is resolving
        }, function () { //fires when modal is invoking
        });
    } })

How can I do that?

PS Sorry for bad code formatting. I don't know why but I cant format it better. I duplicated code here:

how can you inject a controller like that? – Ilan Frumer Jan 09 '14 at 11:31 — Ilan Frumer, Jan 09 '14 at 11:31

score 144 · Accepted Answer · edited Jun 22 '18 at 02:25

144

The $timeout service returns a Promise object which can be used to cancel the timeout.

// Start a timeout
var promise = $timeout(function() {}, 1000);

// Stop the pending timeout
$timeout.cancel(promise);

To cancel all pending timeouts, you need to maintain a list of promises and cancel the complete list when you open the modal.

edited Jun 22 '18 at 02:25

Wolverine

1,712
1
15
18

answered Jan 09 '14 at 11:31

null

7,906
3
36
37

score 2 · Answer 2 · answered Jul 02 '15 at 20:38

2

You may also let them cancel themselves by doing this...

(function(){
  var timer = $timeout(function(){
    console.log(timer.$$timeoutId);
    $timeout.cancel(timer);
  }, 1000);
})();

answered Jul 02 '15 at 20:38

SoEzPz

14,958
8
61
64

18

This doesn't make sense to me. Why would you cancel a `$timeout` that is already called? – pixelfreak Feb 10 '16 at 08:49
I wonder if Angular keeps listeners on that timeout. It looks like so because if you call lots of timeouts, memory keeps growing and eventually lead to a memory leek. – Luca De Nardi Apr 13 '16 at 10:33
I guess you cooooould do that. – Matt Aug 19 '16 at 21:59
2

@pixelfreak Because we can and it's free ! – Marcky Jan 23 '18 at 18:44

AngularJS. Clear $timeout when invoking angular-ui modal

2 Answers2

Linked