Question

我试图将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);。

Answer 1

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

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

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); 
  };
})

Answer 2

这就是我工厂的样子：

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())
});

Answer 3

你需要包含一些功能才能使一切运转起来......

(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);
            })
        }
    }
}());

然后我们将它全部包装在IIFE中并从窗口中删除任何全局变量。

如何正确设置工厂

3 个答案: