Question

我想创建一个Angular服务，允许我访问多个$resource，每个访问给定的API。例如，我希望所有的API调用都是使用

之类的语法从单个服务生成的

var data = API.Products.query(function() {

 $scope.products = data.Products;

});

或

var data = API.Customers.get({id:123}, function() {

 $scope.customer = data;

});

产品和客户是我的API服务中的Angular $resource。目前我正在尝试这样做

    var app = angular.module('myApp', ['ngRoute', 'ngSanitize', 'ngResource', 'API']);


    var APIService = angular.module("API", ["ngResource", function ($resource) {


                this.Products = $resource('/WebApi/Products/:type/:id', {id:'all'},
                {
                    systemUpdate: { method: 'GET' },
                });

                this.Customers = $resource('/WebApi/Customers/:type/:id', {id:'all'},
                {
                    systemUpdate: { method: 'GET' },
                });


           }]);

但是我在编译本服务时遇到错误。 Uncaught Error当我在Firefox中查看同一页面时，错误不会提供有关出错的更多详细信息。提供此类功能的正确方法是什么？

现在是我的工厂：

    app.factory("API", ["ngResource", function ($resource) {


        return {
            API: {
                Alerts: $resource('/WebApi/Alert/:type/:id', { id: 'all' },
                 {
                     systemUpdate: { method: 'GET' },
                     autoArchive: { method: 'POST', url: '/WebApi/Alert/Template/:type' }
                 })
            }
        }


    }]);

Answer 1

只需将其作为工厂并返回必要的资源：

var app = angular.module("myApp");
app.factory("API", ["$resource", function($resource) {
    return {
        API: {
            Customers: $resource('/WebApi/Customers/:type/:id', {id:'all'},
            {
                systemUpdate: { method: 'GET' },
            });
        }
    }
}]);

需要时注入：

app.controller("myController", ["API", function(API) {
    API.Customers.Get({}, function(data) {
        //sample get call from Customers
    });
}]);

创建Angular API服务以提供对所有Web API的访问

1 个答案: