2015-04-15 31 views
0

我试图将我的Firebase身份验证逻辑从控制器移至工厂,但遇到基本设置问题。我正在使用Angularfire在我的应用中完成身份验证,并遵循文档here如何正确设置工厂

在我的控制器中一切正常,但我不知道如何正确设置代码在工厂。我当前的代码如下:

angular 
    .module('app') 
    .factory('authService', authService); 

authService.$inject = ['$firebaseAuth']; 

var ref = new Firebase('https://[MY-FIREBASE].firebaseio.com'); 
var auth = $firebaseAuth(ref); 

return { 
    createUser(email,password): auth.$createUser({ 
     email: email, 
     password: password 
    }).then(function(userData) { 
     $location.path('/people'); 
    }).catch(function(error) { 
     alert(error); 
    }), 

    connectFacebook: auth.$authWithOAuthPopup("facebook").then(function(authData) { 
     $location.path('/places'); 
    }).catch(function(error) { 
     alert("Authentication failed:", error); 
    }), 

    removeUser: auth.$removeUser({ 
     email: vm.email, 
     password: vm.password 
    }).then(function() { 
     alert('User removed'); 
    }).catch(function(error) { 
     alert(error); 
    }) 
} 

是我的目标做的是注入这家工厂为我登录控制器并调用相应的功能线了点击事件,如authService.createUser($scope.email,$scope.password);

回答

4

这可能更像是一个服务而不是工厂的用例。

使用函数语法而不是此对象样式设置工厂/服务要容易得多。

angular.module('app', []) 

.service('AuthService', function($firebaseAuth) { 
    var ref = new Firebase('https://[MY-FIREBASE].firebaseio.com'); 
    var auth = $firebaseAuth(ref); 

    this.createUser = function(email, password) { 
    // ... 
    }; 

    this.connectFacebook = function() { 
    // ... 
    }; 

    this.removeUser = function(email, password) { 
    // ... 
    }; 
}) 

服务公开任何已连接到this,我们可以注入,并在我们的应用程序的其他地方使用它。

.controller('AuthController', function($scope, AuthService) { 
    $scope.email = ''; 
    $scope.password = ''; 

    $scope.register = function() { 
    AuthService.createUser($scope.email, $scope.password); 
    }; 
}) 
+1

谢谢!直到这个解释之前,我实在没有完全理解服务的用处。许多课程和教程通过掩盖服务和“在几乎所有情况下工厂将是最佳选择”来破坏服务。出于这个原因,我一直在寻找让工厂满足我的需求,而不是现在! – MattDionis

+1

角度教程的景观可能会令人困惑。我仍然没有发现一个我认为在用例之间有明确区别的例子,但是我提出了一套自己的规则,它们运行得很好。 –

0

这是我厂的样子:

angular.module('myApp').factory('RegistrationFactory', ['$http', function($http) { 

    var urlBase = '/api/'; 
    var dataFactory = {}; 

    dataFactory.IsRegistered = function() { 
     return $http.get(urlBase); 
    }; 

    dataFactory.RegisterUser = function (username, password, deviceId) { 
     var RegistrationObj = { registration: { DeviceReference: deviceId, Username: username, Password: password, VehicleReg: "" } }; 
     return $http.post(urlBase + 'RegisterDevice', RegistrationObj); 
    }; 
    return dataFactory; 
}]); 

然后我可以使用它在我的控制器是这样的:

angular.module('myApp').controller('RegisterCtrl', function ($scope, RegistrationFactory) { 
    RegistrationFactory.RegisterUser(username, password, $cordovaDevice.getUUID()) 
}); 
0

您需要包括一些功能,使一切工作...

(function() { 
    "use strict"; 
    angular 
     .module('app', []) // dont forget the '[]' here 
     .factory('authService', authService); 

    authService.$inject = ['$firebaseAuth']; 

    function authService($firebaseAuth) { 
     var ref = new Firebase('https://[MY-FIREBASE].firebaseio.com'); 
     var auth = $firebaseAuth(ref); 

     return { 
      createUser: function(email,password) { 
       auth.$createUser({ 
        email: email, 
        password: password 
       }).then(function(userData) { 
        $location.path('/people'); 
       }).catch(function(error) { 
        alert(error); 
       }) 
      }, 

      connectFacebook: auth.$authWithOAuthPopup("facebook").then(function(authData) { 
       $location.path('/places'); 
      }).catch(function(error) { 
       alert("Authentication failed:", error); 
      }), 

      removeUser: auth.$removeUser({ 
       email: vm.email, 
       password: vm.password 
      }).then(function() { 
       alert('User removed'); 
      }).catch(function(error) { 
       alert(error); 
      }) 
     } 
    } 
}()); 

Th我们将它全部包装在一个IIFE中,并从窗口中移除任何全局变量。