AngularJS $资源自定义操作

时间:2015-08-17 07:40:08

标签: angularjs angular-resource

我刚开始使用$resource检索数据,但我在实施自定义操作时遇到问题。标准GET使用对象ID,如下所示;

pageContentService.get({ pageId: 1 }, function (data) {
    vm.pageContent = data.content;
});

我还希望能够使用字符串检索相同的数据,如下所示;

pageContentService.getByPageName({ pageName: "Home" }, function (data) {
    vm.pageContent = data.content;
});

我的$resource服务是;

(function () {
    "use strict";

    angular
    .module("common.services")
    .factory("pageContentService", ["$resource", pageContentService]);

    function pageContentService($resource) {
        return $resource("/api/pageContent/:pageId", null,
            {
                "getByPageName": { method: "GET", url: "/api/pageContent/:pageName", isArray: false }
            });
    };
})();

我嘲笑后端如下;

(function (undefined) {
    "use strict";

    var app = angular.module("pageContentServiceMock", ["ngMockE2E"]);

    app.run(function ($httpBackend) {
        var content = [
            { "pageId": 0, "pageName": "Unknown", "content": "<h1>Page not found</h1>" },
            { "pageId": 1, "pageName": "Home", "content": '<h1>Home Page</h1>' },
            { "pageId": 2, "pageName": "Programs", "content": '<h1>Programs Page</h1>' }
        ];

        var contentUrl = "/api/pageContent";
        $httpBackend.whenGET(contentUrl).respond(content);

        var contentById = new RegExp(contentUrl + "/[0-9][0-9]*", '');
        $httpBackend.whenGET(contentById).respond(function (method, url, data) {
            var pageContent = content[0];
            var parameters = url.split("/");
            var length = parameters.length;
            var pageId = parameters[length - 1];

            if (pageId > 0) {
                for (var i = 0; i < content.length; i++) {
                    if (content[i].pageId == pageId) {
                        pageContent = content[i];
                        break;
                    }
                }
            }
            return [200, pageContent, {}];
        });

        var contentByName = new RegExp(contentUrl + "/[a-z][A-Z]*", '');
        $httpBackend.whenGET(contentByName).respond(function (method, url, data) {
            var pageContent = content[0];
            var parameters = url.split("/");
            var length = parameters.length;
            var pageName = parameters[length - 1];

            if (pageName.length > 0) {
                for (var i = 0; i < content.length; i++) {
                    if (content[i].pageName == pageName) {
                        pageContent = content[i];
                        break;
                    }
                }
            }
            return [200, pageContent, {}];
        });
    });
})();

使用&#34; pageId&#34;时,代码按预期工作返回数据然而它似乎没有执行&#34; getByPageName&#34;后一代码中服务的行为。

根据我的理解,自定义操作用于扩展标准$resource方法的现有功能,因此我认为我没有正确实现它。

2 个答案:

答案 0 :(得分:0)

你可以尝试这样的事情:

angular.module('common.services').factory('pageContentService', ['$resource',
    function($resource) {
        return {
            getByPageName: $resource('/api/pageContent/:pageName', {pageName: '@pageName'}, { method: "GET", isArray: false }),
            getByPageId: $resource('/api/pageContent/:id', {id: '@id'}, { method: "GET", isArray: false })
        };
    }
]);

在控制器中注入pageContentService后,您可以通过以下方式检索数据:

pageContentService.getByPageName({ pageName: "Home" }, function (data) {
    vm.pageContent = data.content;
});

或者:

pageContentService.getByPageId({ id: 1 }, function (data) {
    vm.pageContent = data.content;
});

答案 1 :(得分:0)

问题原来是嘲弄。我正在使用;

var contentByName = new RegExp(contentUrl + "/[a-z][A-Z]*", '');

当我应该使用时;

var contentByName = new RegExp(contentUrl + "/[a-zA-Z]+", '');

一旦我修好了,我就可以使用;

pageContentService.get({ pageId: 1 }, function (data) {
    vm.pageContent = data.content;
});

使用默认的“GET”或;

检索数据
pageContentService.getByPageName({ pageName: "Home" }, function (data) {
    vm.pageContent = data.content;
});

使用自定义操作。我也尝试使用Michelem的建议;

function pageContentService($resource) {
    return {
        "getByPageId": $resource('/api/pageContent/:pageId', null, { method: "GET", isArray: false }),
        "getByPageName": $resource('/api/pageContent/:pageName', null, { method: "GET", isArray: false })
    };
}

但我无法让它发挥作用。