Question

假设我想要多个用户服务实例（selectedUser＆amp; currentUser），它们提供相同的功能。目前，我只是通过创建两个从本地函数中提取其定义的服务来解决问题：

angular.module('myUserModule', [])

.factory('userFactory', ['$http', '$q', function ($http, $q) {
  return function getUser(userId) {
    return new $q(function (resolve) {
      //Gets the user with the provided userId
    }
  }
}])

.value('currentUserId', '')
.value('selectedUserId', '')

.service('currentUserService', ['userFactory', 'currentUserId', User])
.service('selectedUserService', ['userFactory', 'selectedUserId', User]);

function User(userFactory, userId) {
  var self = this;
  var promise = userFactory(userId);
  promise.then(function setUserSuccess(result) {
    self.user = result;
  }
}

只是想知道其他人是如何解决这个问题的。

更新：只是为了澄清我也将这些服务用作单身人士。

Answer 1

您可以使用工厂作为API来使用getter和setter方法返回对象集合。

您可以使用new关键字声明新工厂。但是，最好将实例的创建封装到getter方法中。

<强>服务

(function(){

  function userFactory($http, $q){

    //Create our userFactory
    function userFactory(num){
      this.num = num;
    };

    //Retrieve some user data for example
    function getUser(id){
      return new $q(function(resolve){
        resolve({id: id, data: [1,2,3,4]});
      });
    }

    //Another method
    function awesome(){
      console.log('Awesome method called by : ' + this.num);
    }

    //Set method by prototyping
    userFactory.prototype.getUser = getUser;
    userFactory.prototype.awesome = awesome;

    return {
      //Use get method to return a new instance of our factory
      get: function(){
        //Pass a random id for our factory
        return new userFactory(Math.ceil(Math.random() * 100));
      }
    }

  }

  angular
    .module('app')
    .factory('UserFactory', userFactory);

})();

您可以使用 .get（）方法创建自己的实例：

<强>控制器

(function(){

function Controller($scope, UserFactory) {


  var factoryA = UserFactory.get()
  var factoryB = UserFactory.get();

  console.log('A num instance ' + factoryA.num);
  console.log('B num instance ' + factoryB.num);

  factoryA.getUser(1).then(function(data){
    console.log(data);
  });

  factoryB.awesome();

  console.log('Equality = ' + angular.equals(factoryA, factoryB));

}

angular
.module('app', [])
.controller('ctrl', Controller);

})();


(function(){

function Controller2($scope, UserFactory) {

  var factoryC = UserFactory.get()

  console.log('C num instance ' + factoryC.num);

}

angular
.module('app')
.controller('ctrl2', Controller2);

})();

Answer 2

在一个不相关的问题中，解决方案最终使用了一个创建多个实例的工厂：

what is the scope of a service in angularjs?

使用工厂模式。

从本质上讲，如果您有用户服务，则可以使用工厂返回该服务的唯一实例。

function User(userId, $http) {

    var self = this;    

    $http.get('/api/user/', {userId: userId}).success(function(result) {

        self.details = result.data;
    }):
}

userFactory.$inject = ['$http'];
function userFactory($http) {

    return function(user) {

        return new User(user, $http);
    } 
}
angular.module('app').factory('user', userFactory);

但是对于这个例子，你可以使用$resource。这是一个内置的角度工厂，它返回唯一的Resource实例。

angularjs相同服务的多个实例

2 个答案: