Question

我需要有一组资源工厂来使用rest api并在我的所有模块和控制器中使用它。我对如何分离以及如何从控制器访问工厂感到困惑。

举个例子，让我们假设我：

// rest.js
angular.module('myApp.rest', ['ngResource'] )
    .factory('Book', function ($resource) {
        return $resource('api/book', {}, {
            getBook: {
                method: 'GET'
            },
        });
    })

这里的主要模块为myApp：

 // app.js
 angular.module('myApp', [

        'ngRoute',
        'ngResource',

        'app.rest',
        'app.library'

    ])
      .config(['$routeProvider', function ($routeProvider) {
            $routeProvider.
                when('/book', {
                    templateUrl: 'someTemplate',
                    controller: 'LibraryCTRL',
                });

现在我想要另一个名为app.library的模块，它可以使用Book资源。依赖注入看起来如何？

更重要的问题：这是正确的方法吗？我的意思是将整个Book工厂附加到myApp或使用单独的myApp.rest模块更好吗？

// library.js
angular
    .module('myApp.library', ['ngResource']) // INJECT REST MODULE HERE?
    .controller('LibraryCtrl', Library);

// INJECT BOOK RESOURCE HERE? 
Library.$inject = [];

// USE BOOK IN THIS CONSTRUCTOR
function Library() {

    var vm = this;

    // USING IT
    Book.getBook(function(data){
         vm.book = data;
    });
}

Answer 1

让我们抽象问题

据我了解你想制作定制工厂“服务”，可以在负责消费休息api的所有模块和控制器中使用

所以你将拥有serviceModule.js

var ServiceApp = angular.module('ServiceApp', []);
ServiceApp
        .factory(
                'restControllerService',
                [
                        '$http',
                        function($http) {

                            var doRequest = 
                            function(URL) {
                                    return $http({
                                        method : 'get',
                                        url :  URL, 
                                       headers : {
                                       'Content-Type' :'application/json'
                                                 }
                                    });
                                    });
                                }

                            }
                            return {
                                getBook : function() {
                                    return doRequest('api/book');
                                }
                            };
                        } ]);

你可以在任何其他模块中注入它

var library = angular.module('libraryModule', [ "ServiceApp" ]);
libraryModule.controller('LibraryCtrl', [
        '$scope',
        'restControllerService',
        function($scope,restControllerService) {

            $scope.book = null;

            $scope.getbook = function() {

                    restControllerService.getbook('api/book').success(
                            function(data) {
                                $scope.book = data;
                            }).error(function() {
                        $scope.book = null;
                    });
                }
            };

Answer 2

我相信你正在尝试这样做： myApp - ＆gt; myApp.library - ＆gt; myApp.rest

你几乎就在那里。只需让myApp.library注入myApp.rest模块。

angular
    .module('myApp.library', ['myApp.rest'])
    .controller('LibraryCtrl', ['Book', function(Book) {
     // use Book.getBook() here.
    }]);

同时从myApp模块中删除myApp.rest和ngResource的依赖关系，因为您没有在那里使用它们。

angular.module('myApp', [
        'ngRoute',
        'app.library'
    ])

通常，只有在您在该模块中直接使用依赖项时才添加依赖项。

我不相信如何将代码分成模块是最好的做法。就个人而言，我喜欢在整个应用程序中使用单个模块，除非我尝试在另一个应用程序中重用一段代码。

AngularJS在模块和控制器之间共享REST服务

2 个答案: