8

I'm making a webpage that you can edit the text and after you stop typing for 1 second it will automagically save what you've typed.

Currently i'm just working out the $timeout details. I have it working when I call the update method with no params, but when I call it with params, I get the error:

Error: fn is not a function $TimeoutProvider/this.$get</timeout/timeoutId<@http://localhost:63342/express_example/bower_components/angular/angular.js:14014 completeOutstandingRequest@http://localhost:63342/express_example/bower_components/angular/angular.js:4300 Browser/self.defer/timeoutId<@http://localhost:63342/express_example/bower_components/angular/angular.js:4601

Why am I getting this error when doing:

timeout = $timeout(update(element, content), 1000);

but not when I do:

timeout = $timeout(update, 1000);

Obviously I need to pass the params into the update method because I need to know what to update.

debounceUpdate($(this), data.content);

var debounceUpdate = function(element, content) {
    console.log('in debouce');
    if (timeout) {
      $timeout.cancel(timeout);
    }

    timeout = $timeout(update(element, content), 1000);
};

// Update an existing section
var update = function(element, content) {
    console.log('in update');
    console.log('section_id to update is '+element.data('sectionId'));
    console.log(content);
}
Catfish
  • 18,876
  • 54
  • 209
  • 353
  • *pass the params into the update method* - http://stackoverflow.com/questions/1190642/how-can-i-pass-a-parameter-to-a-settimeout-callback – Mars Robertson Apr 30 '14 at 14:45

1 Answers1

13

Your code calls update immediately and tries to pass its return value as the $timeout callback. You really wanted to call update from the $timeout handler instead:

timeout = $timeout(function() {update(element, content);}, 1000);
Dark Falcon
  • 43,592
  • 5
  • 83
  • 98
  • Interesting.. Can you elaborate on this more? I understand callbacks in js, but I guess i'm not sure how your answer (which works) differs from what I had. – Catfish Apr 30 '14 at 14:46
  • 4
    `update(element, content)` calls `update`. Right away. So `$timeout(update(element, content), 1000)` calls `update` right away, then passes the return value of that as the first parameter to `$timeout`, which is also called right away. – Dark Falcon Apr 30 '14 at 14:50
  • 2
    `function() {update(element, content);}` creates a closure which, when invoked, calls `update`. `$timeout(function() {update(element, content);}, 1000)` calls `$timeout` right away and passes that closure as the first argument. `$timeout` waits a while, then invokes the closure, which invokes `update`. – Dark Falcon Apr 30 '14 at 14:51