AngularFire authWithPassword not working with angular factory

Question

  app.factory("Auth", ["$firebaseAuth", function($firebaseAuth) {
  var ref = new Firebase("https://XXXXXX.firebaseio.com/");
  var auth = $firebaseAuth(ref);

  var Auth = {
    login: function(){
      return auth.$authWithPassword({
        "email": "[email protected]", //hard-coding in the email & password for testing
        "password": "1"
      }, function(error, authData) {
        if (error) {
          console.log("Login Failed!", error);
        } else {
          console.log("Login Success!", authData);
        }
      });
    }
  return Auth;
}]);

app.controller("SampleCtrl", ["$scope", "Auth", "$firebaseAuth", function($scope, Auth, $firebaseAuth) {
  $scope.login = Auth.login();
}]);

I am trying to create a factory to use the angularFire user authentication function

<button ng-click="login()">Login</button>

It returns an error: TypeError: Cannot read property '0' of null What am I doing wrong? PLUNKER

Answer 1

When using AngularFire, a call to login with password provider should look as follows:

var ref = new Firebase("url","name");
   var svcAuth = return $firebaseAuth(ref); 
   svcAuth.$authWithPassword({
                        email: email,
                        password: "******"})
                        .then(onLogon)
                        .catch(onError);

   function onLogon(authData) {
            console.log("Authenticated payload:", authData);                
    }

    function onError(error) {
            console.log("Authentication error:", error);
    }

If you are NOT using AngularFire (using Firebase.js only), the code to login should look:

var ref = new Firebase("url");
ref.authWithPassword({
  email    : "email",
  password : "*****"
}, function(error, authData) {
  if (error) {
    console.log("Login Failed!", error);
  } else {
    console.log("Authenticated payload:", authData);
  }
});

hope that helps.

Answer 2

try this it works for me :

angular.module('database-operations').factory('Auth', ["$firebaseAuth", function($firebaseAuth) {
        var ref = new Firebase("https://XXXXX.firebaseio.com/");
        var auth = $firebaseAuth(ref);

     return{
            login: function(){
                return auth.$authWithPassword({
                    "email": "[email protected]", //hard-coding in the email & password for testing
                    "password": "1"
                }).then(function(authData){
                    console.log('Login successful',authData.uid);
                }).catch(function(error) {
                    console.error("Authentication failed:", error);
                });
            }

        }
    }
    ]);

Answer 3

app.controller("loginCtrl", ["$scope", "Auth", function($scope, Auth){
  $scope.login = function(){
    Auth.login().then(function(){
      console.log("OK");  
    });
  };
}]);

Somehow this works by wrapping Auth.login() within a function and a then following it. Can anyone explain why it works?