AngularJS : Pass variables in service

Question

I am trying to move my login logic to a service.. but I don't know how to pass the login details to the service.

I have:

$scope.login = function (login_username, login_password) {
    $http.post('/login', {userName: login_username, password: login_password}).success(function(response) {
        ....
    });
});

What I am trying to do:

1. Have a service that will take looking details and fetch user's profile...

app.factory('userProfile', function($http) {
  return {
    getUserProfile: function() {
      return $http.post('/login',{userName: userNameVar, password: passwordVar});
    }
  };
});

... But replace userNameVar and passwordVar with users details, when user clicks login

function appCtrl($scope, userProfile) {
    $scope.login = function (login_username, login_password, rememberMe) {
        userProfile.getUserProfile().success(function(profile) {
            $scope.uProfile = profile;
            console.log($scope.uProfile);
        });
    };
};

I tried inserting {userName: login_username, password: login_password} in userProfile.getUserProfile() like userProfile.getUserProfile({userName: login_username, password: login_password})

Answer 1

Change your getUserProfile function in the service to:

app.factory('userProfile', function($http) {
  return {
    getUserProfile: function(userNameVar, passwordVar) {
      return $http.post('/login',{userName: userNameVar, password: passwordVar});
    }
  };
});

and then your contoller can look like:

function appCtrl($scope, userProfile) {
    $scope.login = function (login_username, login_password, rememberMe) {
        userProfile.getUserProfile(login_username, login_password).success(function(profile) {
            $scope.uProfile = profile;
            console.log($scope.uProfile);
        });
    };
};