Mikel Mikel - 4 months ago 10
AngularJS Question

In AngularJS how to modify service property from callback inside service itself

I have a factory which does a http call and in the error callback I want to set a property a value, e.g

this.password = null
but
this.password
doesn't point to the password.

On the other hand, when I do the POST the data is sent fine:
password: this.password


The scope of the password property should be different right? Or I'm missing something else?

.factory('LogInService', function($http) {

return {
username: null,
password: null,
logIn: function() {
return $http({
method: 'POST',
url: 'http://my-domain/api/signin',
data: {
username: this.username,
password: this.password
}
})
.then(
function(success){

},
function(err){
// reset password field
this.password = null; // <-- not working
}
);
}
}
});


I could set all properties and methods to a var and then return it, but I'd rather method above. I mean:

var myService = {
// my property and methods...
}

errorCallBack = function(){
myService.password = null;
}

return myService;

Answer

You've got a scoping issue. Should be easy enough to do something like this. As always, untested, but seems like it would work.

.factory('LogInService', function($http) {

  return {
    username: null,
    password: null,
    logIn: function() {
      var svc = this; //<----
      return $http({
        method: 'POST',
        url: 'http://my-domain/api/signin',
        data: {
          username: svc.username, //<---
          password: svc.password  //<---
        }
      })
      .then(
        function(success){

        },
        function(err){
          // reset password field
          svc.password = null;  //<----
        }
      );
    }
  }
});