标签: angularjs-factory

3296
推荐指数
28
解决办法
76万
查看次数

AngularJS:何时使用服务而不是工厂

请在这里忍受我.我知道还有其他答案,例如: AngularJS:Service vs provider vs factory

但是,当你在工厂使用服务时,我仍然无法弄清楚.

据我所知,工厂通常用于创建可由多个控制器调用的"通用"功能:创建通用控制器功能

Angular文档似乎更喜欢工厂而不是服务.他们甚至在使用工厂时提到"服务",这更令人困惑!http://docs.angularjs.org/guide/dev_guide.services.creating_services

那么什么时候才能使用服务?

是否有可能通过服务完成或更容易完成的事情?

幕后有什么不同吗?性能/内存差异?

这是一个例子.除了声明的方法,它们看起来完全相同,我无法弄清楚为什么我会做一个与另一个.http://jsfiddle.net/uEpkE/

更新:从托马斯的回答看来,似乎暗示服务是为了更简单的逻辑和工厂用于更复杂的逻辑与私有方法,所以我更新了下面的小提琴代码,似乎两者都能够支持私人功能?

myApp.factory('fooFactory', function() {
    var fooVar;
    var addHi = function(foo){ fooVar = 'Hi '+foo; }

    return {
        setFoobar: function(foo){
            addHi(foo);
        },
        getFoobar:function(){
            return fooVar;
        }
    };
});
myApp.service('fooService', function() {
    var fooVar;
    var addHi = function(foo){ fooVar = 'Hi '+foo;}

    this.setFoobar = function(foo){
        addHi(foo);
    }
    this.getFoobar = function(){
        return fooVar;
    }
});

function MyCtrl($scope, fooService, fooFactory) {
    fooFactory.setFoobar("fooFactory");
    fooService.setFoobar("fooService");
    //foobars = "Hi fooFactory, …
Run Code Online (Sandbox Code Playgroud)

angularjs angularjs-service angularjs-factory

294
推荐指数
4
解决办法
12万
查看次数

AngularJS:工厂和服务?

编辑2016年1月:由于这仍然备受关注.自从问这个我已经完成了一些AngularJS项目,并且对于那些我最常用的项目factory,构建了一个对象并在最后返回了对象.我下面的语句是仍然如此,但是.

编辑:我想,我终于明白了两者之间的主要区别,和我有一个代码示例演示.我也在想这个问题所提出的重复不同.重复的说,服务不是实例化,但如果你将其设置为我下面演示,它实际上是.服务可以被设置为是完全一样的工厂.我还将提供显示工厂故障服务的代码,这似乎没有其他答案.

如果我成立VaderService像这样(即服务):

var module = angular.module('MyApp.services', []);

module.service('VaderService', function() {
    this.speak = function (name) {
        return 'Join the dark side ' + name;
    }
});
Run Code Online (Sandbox Code Playgroud)

然后在我的控制,我可以这样做:

module.controller('StarWarsController', function($scope, VaderService) {
    $scope.luke = VaderService.speak('luke');   
});
Run Code Online (Sandbox Code Playgroud)

通过服务,注入到控制器的VaderService被实例化,所以我可以调用VaderService.speak,但是,如果我将VaderService更改为module.factory,控制器中的代码将不再起作用,这是主要区别.随着工厂,VaderService注入到控制器实例化,这就是为什么你需要设立一家工厂(见我的问题为例)返回一个对象.

但是,您可以设置在完全相同的方式服务,你可以建立一个工厂(IE有它返回一个对象)和服务的行为完全一样作为一个工厂

鉴于此信息,我认为没有理由使用工厂超过服务,服务可以做任何工厂可以做的更多.

下面原来的问题.


我知道这已经被问的时候加载,但我实在看不出工厂和服务之间的功能差异.我读过这个教程:http://blogs.clevertech.biz/startupblog/angularjs-factory-service-provider

它似乎给一个合理的很好的解释,但是,我设立了我的应用程序如下:

的index.html

<!DOCTYPE html>
<html>
    <head>
    <title>My App</title>
    <script src="lib/angular/angular.js"></script>
    <script type="text/javascript" src="js/controllers.js"></script>
    <script type="text/javascript" src="js/VaderService.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    </head>

    <body ng-app="MyApp"> 
        <table ng-controller="StarWarsController">
            <tbody>
            <tr><td>{{luke}}</td></tr>
            </tbody>
        </table> …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-service angularjs-factory

213
推荐指数
3
解决办法
24万
查看次数

AngularJS:什么是工厂?

我一直在做很多工作Angular.js,总的来说我发现它是一个有趣而强大的框架.

我知道有很多关于服务与工厂与提供商与价值观的讨论,但我仍然对这是什么感到困惑Factory.

Factory已在其他StackOverflow讨论中定义如下:

工厂

语法:module.factory( 'factoryName', function );结果:当将factoryName声明为injectable参数时,将通过调用传递给module.factory的函数引用来提供返回的值.

我发现这个解释很难掌握,并没有增加我对工厂的理解.

有没有人有任何解释或现实生活中的例子来分享正是一个Factory是,为什么你要代替的使用它Service,Provider或者其他?

更新

A service 保存对任何对象的引用.

A factory 返回任何对象的函数

A provider 返回任何函数的函数

- p - -

javascript angularjs angularjs-factory

100
推荐指数
3
解决办法
7万
查看次数

如何从angularjs中选择ng-change调用服务方法?

我是棱角分明的新手.我试图从ng-change of select中调用工厂服务方法'getScoreData',但是无法完成它.请帮忙.

Html代码:

<select ng-model="Score" ng-change="getScoreData(Score)" ng-options="c.name for c in     Scores"></select>
Run Code Online (Sandbox Code Playgroud)

Angularjs代码:

var app = angular.module('audiapp', []);

app.controller('audiLayoutCtrl', function ($scope, ScoreDataService) {
    ScoreDataService.getScoreData($scope.Score, function (data) {
        $scope.ScoreData = data;
    });
});

app.factory('ScoreDataService', function ($http) {
    return {
        getScoreData: function (Score, callback) {
            var params = {
                questionCode: Score.code
            }

            return $http({
                url: 'Home/GetAvgData',
                method: 'GET',
                params: params
            }).success(callback);
        }
    };
});
Run Code Online (Sandbox Code Playgroud)

上面是服务工厂方法,它从控制器实例化.我尝试从ng-change of select实例化,但它既没有给出错误也没有被调用.

angularjs angularjs-directive angularjs-service angularjs-factory angularjs-ng-change

32
推荐指数
1
解决办法
11万
查看次数

AngularJS:如何使用丰富的分层对象模型构建控制器和工厂/服务?

我读了这两篇很棒的文章:

Jonathan Creamer 的angularjs控制器状态

由Todd Motto 重新思考AngularJS控制器

在这些文章中,作者讨论了使用控制器的正确方法(使它们成为视图和模型之间的贫血桥梁)和工厂/服务(业务逻辑应该存在的地方).

这是很好的信息,我很高兴开始在我的一个项目上重构控制器,但我很快发现,如果你有一个丰富的对象模型,文章中显示的结构就会崩溃.

以下是"重新思考Angularjs控制器"的设置概述:

这是控制器:

app.controller('InboxCtrl', function InboxCtrl (InboxFactory) {

    var vm = this;

    vm.messages = InboxFactory.messages;

    vm.openMessage = function (message) {
      InboxFactory.openMessage(message);
    };

    vm.deleteMessage = function (message) {
      InboxFactory.deleteMessage(message);
    };

    InboxFactory
      .getMessages()
      .then(function () {
      vm.messages = InboxFactory.messages;
    });

});
Run Code Online (Sandbox Code Playgroud)

这是工厂:

app.factory('InboxFactory', function InboxFactory ($location, NotificationFactory) {

  factory.messages = [];

  factory.openMessage = function (message) {
    $location.search('id', message.id).path('/message');
  };

  factory.deleteMessage = function (message) {
    $http.post('/message/delete', message)
    .success(function (data) {
      factory.messages.splice(index, 1);
      NotificationFactory.showSuccess();
    }) …
Run Code Online (Sandbox Code Playgroud)

structure object-model angularjs angularjs-factory angularjs-provider

30
推荐指数
1
解决办法
1176
查看次数

AngularJS工厂参数

我正在尝试将参数发送到angularjs服务.这是我的服务代码:

angular.module('skyBiometryServices', ['ngResource'])
.factory('Facedetect', function( $resource ) {
    return $resource('skyBiometry/facedetect', {}, {
        query: {
            method : 'GET',
            params : {imageUrl: "http://cdn1-public.ladmedia.fr/var/public/storage/images/dossiers/presidentielles-2012/les-news-sur-les-presidentielles-2012/exclu-public-cauet-pour-ces-presidentielles-personne-ne-me-fait-rever-209063/2064021-1-fre-FR/Exclu-Public-Cauet-Pour-ces-presidentielles-personne-ne-me-fait-rever-!_portrait_w674.jpg"},
            isArray: false
        }
    })
});
Run Code Online (Sandbox Code Playgroud)

在我的控制器中我有这个:

function IndexCtrl($scope,Facedetect) {
    $scope.text = Facedetect.query();
}
Run Code Online (Sandbox Code Playgroud)

如何从控制器将imageurl发送到我的服务?像这样的东西

function IndexCtrl($scope,Facedetect) {
    $scope.text = Facedetect.query('MY IMAGE URL');
}
Run Code Online (Sandbox Code Playgroud)

提前谢谢.

angularjs angularjs-factory

18
推荐指数
3
解决办法
3万
查看次数

我的AngularJS工厂可以有多个功能吗?

我正在遵循官方AngularJS文档中的教程,我想知道是否可以向Phone工厂添加另一个功能,以便我可以更好地组织代码.他们已经声明了一个"查询"函数,但是如果我想添加一个引用不同url的query2函数...比如说phones2 /:phoneName.json呢?

工厂申报:

var phonecatServices = angular.module('phonecatServices', ['ngResource']);

phonecatServices.factory('Phone', ['$resource',
  function($resource){
    return $resource('phones/:phoneId.json', {}, {
      query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
    });
  }]);
Run Code Online (Sandbox Code Playgroud)

我已经尝试过很多东西,但是它们似乎没有用到:s

这个答案似乎在正确的轨道上,但每个工厂功能的语法与上述工厂不完全匹配.

有点像:

phonecatServices.factory('Phone', ['$resource',
      function($resource){
       return {
        query: ...
        query2: ...
       }
      }]);
Run Code Online (Sandbox Code Playgroud)

angularjs angularjs-factory

17
推荐指数
2
解决办法
2万
查看次数

在另一家工厂AngularJS内使用工厂

我有一个模块......

angular.module('myModule', []);
Run Code Online (Sandbox Code Playgroud)

然后是工厂

angular.module('myModule')
.factory('factory1', [
  function() {
    //some var's and functions
}
]);
Run Code Online (Sandbox Code Playgroud)

然后是另一家工厂

angular.module('myModule')
.factory('factory2', [
  function() {
    //some var's and functions BUT I want to use some var's from factory1
}
]);
Run Code Online (Sandbox Code Playgroud)

但是我想在factory2中使用factory1中的一些变量,如何将factory1注入factory2?

javascript angularjs angularjs-module angularjs-factory

17
推荐指数
1
解决办法
1万
查看次数

如何扩展AngularJS资源($ resource)的构造函数?

我有一个模型,定义使用$resource,我成功加载.

正如所承诺的,每个加载的实例都是我定义的类的实例.

(以下示例来自Angular文档.在其中,User.get结果是一个对象instanceof User.)

var User = $resource('/user/:userId', {userId:'@id'});
Run Code Online (Sandbox Code Playgroud)

但是,想象每个用户来自这样的电线:

{
  "username": "Bob",
  "preferences": [
    {
      "id": 1,
      "title": "foo",
      "value": false
    }
  ] 
}
Run Code Online (Sandbox Code Playgroud)

我定义了一个PreferencePreference对象添加有价值方法的工厂.但是当用户加载时,这些preferences不是Preference自然的.

我试过这个:

User.prototype.constructor = function(obj) {
  _.extend(this, obj);
  this.items = _.map(this.preferences, function(pref) {
    return new Preference(pref);
  });
  console.log('Our constructor ran'); // never logs anything
}
Run Code Online (Sandbox Code Playgroud)

但它没有任何效果,也从未记录任何东西.

如何使我的Users' preferences数组中的每个项目成为一个实例Preference

angularjs angularjs-factory angularjs-resource

15
推荐指数
2
解决办法
9275
查看次数