angular acsess 'this' in callback

Question

I'm storing an object inside of the service in my angular app, I can't access 'this' from within the callback method. Something like this...

    app.service("myService", ['$http', '$q', 
        function($http, $q) {
            return ({foo: foo});

            this.myObj = {};

          function doSomething(param, callback){
            param++;
            callback(param);
          } 

          function foo(param){
          doSomething(param, function(responce){ 
            this.myObj.myParam = responce;//'this' is undefined
          });
          }
     });

How do I access it correctly? Thank you...

Please use the search before you ask a new question. – Felix Kling Mar 22 '16 at 22:57 — Felix Kling, Mar 22 '16 at 22:57
Will try better next time... Yes, Than you! – Uliana Pavelko Apr 06 '16 at 17:08 — Uliana Pavelko, Apr 06 '16 at 17:08

score 1 · Answer 1 · answered Mar 22 '16 at 22:53

'this' is only kept in current scope of the function. when called inside a new function 'this' changes. what most people do is var that = this;

 app.service("myService", ['$http', '$q', 
    function($http, $q) {
        var that = this;

        return ({foo: foo});

        this.myObj = {};

      function doSomething(param, callback){
        param++;
        callback(param);
      } 

      function foo(param){
        doSomething(param, function(responce){ 
          that.myObj.myParam = responce;//'that' defined
        });
      }
 });

score 0 · Accepted Answer · answered Mar 22 '16 at 22:51

If obj is the object you want to be the this, you can use bind to set it as the actual this for the function f, as an example: f.bind(obj).

As from the documentation:

The bind() method creates a new function that, when called, has its this keyword set to the provided value [...]

score 0 · Answer 3 · answered Mar 22 '16 at 22:55

You should store first "this" object into some variable. And you should use it inside callback function.

app.service("myService", ['$http', '$q', 
    function($http, $q) {
        return ({foo: foo});
        var self = this;
        self.myObj = {};

      function doSomething(param, callback){
        param++;
        callback(param);
      } 

      function foo(param){
      doSomething(param, function(responce){ 
        self.myObj.myParam = responce;
      });
      }
 });

I wish it helped you.

angular acsess 'this' in callback

3 Answers3