Question

实施工厂/服务的最恰当/最干净的方法是什么？

我遇到过几种不同的做法，并且自己想一想，实际上最好的方式是什么......

首先这个方法：

(function(){
var github = function($http) {
    var getUser = function(username) {
        return $http.get("https://api.github.com/users/" + username)
            .then(function(response) {
                return response.data;
            });
    };

    var getRepos = function(user) {
        $http.get(user.repos_url)
            .then(function(response) {
                return response.data;
            });
    };

    return {
        getUser: getUser,
        getRepos: getRepos
    };
};
var module = angular.module("githubViewer");
module.factory("github", github);
}());

在最近的一个教程中我读到的是使用的方法。请注意，在底部我添加了一个名称然后是函数的工厂。函数调用包含$ http。根据我对（新）角度与控制器一起工作的理解是为了使缩小工作正常，你需要先将$ http作为字符串传递，然后将其用作参数。这种方法不起作用。

接下来我把它改写成这样：

(function(){
var github = function($http) {
    this.getUser = function(username) {
        return $http.get("https://api.github.com/users/" + username)
            .then(function(response) {
                return response.data;
            });
    };

    this.getRepos = function(user) {
        $http.get(user.repos_url)
            .then(function(response) {
                return response.data;
            });
    };

    return {
        getUser: getUser,
        getRepos: getRepos
    };
};
var module = angular.module("githubViewer");
module.factory("github", ["$http", github($http)]);
}());

我在工厂调用中添加了一组参数。运行代码，它的工作原理相同。我假设这将允许缩小？（如果它之前甚至有问题）。添加＆＃34; $ http＆＃34;是多余的到实际的功能本身＆＃34; var github = function（$ http）＆＃34; ？因为我也删除了＆＃34; $ http＆＃34;看看会发生什么，它仍然按预期运行。

最后我试过这个：

(function(){
var module = angular.module("githubViewer");
module.factory("github",
    ["$http", function($http) {
        this.getUser = function(username) {
            return $http.get("https://api.github.com/users/" + username)
                .then(function(response) {
                    return response.data;
                });
        };

        this.getRepos = function(user) {
            $http.get(user.repos_url)
                .then(function(response) {
                    return response.data;
                });
        };

        return {
            getUser: getUser,
            getRepos: getRepos
        };
    };
]
}());

这看起来对我来说最干净。我没有传递一个带标签的函数，而是传递了一个匿名函数并给出了一个字符串来表示它。我运行代码，它按预期工作。我还添加了＆＃34;这个＆＃34;关键词而不是将变量声明为函数。无论有没有＆＃34;这个＆＃34;它仍然有效。

现在这里有困惑......最好的方法是什么？这些都不是最好的方法吗？我更喜欢使用this.name = function而不是var name = function。在这方面最擅长的是什么？它实际上更易于使用

module.factory("github"["$http", function($http)

VS

module.factory("github", github);

或

module.factory("github", ["$http", github($http)]);"

除此之外，控制器，服务，工厂，提供商都应该以同样的方式宣布吗？

Answer 1

我个人使用以下表格：

angular.module('myApp').controller('myController', [
    '$scope', '$state', '$http',
    function ($scope, $state, $http) {
        ...
    }
]);

当您声明您的服务/工厂/控制器等时，您可以避开全局范围压缩，您不必在匿名函数中包装声明，而且它允许缩小。正如Joe在另一个回答中提到的，使用数组符号是首选方法。

你在评论中提到了可读性，我个人对上述内容完全没有任何问题，从未有任何抱怨。在一些项目中，我使用了另一种形式，因为依赖的数量，我把它们全部放在一个单独的行上：

angular.module('myApp').controller('myController', [
    '$scope',
    '$state',
    '$http',
    function ($scope, $state, $http) {
        ...
    }
]);

这样很容易看到注入的内容，但很难将其与函数的参数进行比较。但这是一个偏好问题。

我看到的方式，代码越少越好。如果你可以在没有匿名函数的情况下使用匿名函数？代码越少，可读性越强。声明单独的函数并将其分配给您的定义也是如此。让我感到困惑的是。

Answer 2

这个答案涉及很多主观性，但是角度的DI系统总是建议你如图here所示声明依赖关系。与往常一样，可能没有最佳方式，但有一种角度方式。

在您的特定情况下滚动到内联数组注释，它明确指出它是声明服务的首选方式。

在AngularJS中，申报工厂/服务的最简洁方法是什么？

2 个答案: