Angularjs - 定制$ resource

bsr*_*bsr 9 javascript angularjs

我使用Angular $resource进行REST服务.由于我的get响应中的怪癖,我不能将$ resource服务用于CRUD应用程序.

创建一个新的对象工作(比如Card),对于:

var newCard = new CreditCard();
newCard.name = "Mike Smith";
newCard.$save();
Run Code Online (Sandbox Code Playgroud)

得到也有效:

var card = CreditCard().get({_id:1)
Run Code Online (Sandbox Code Playgroud)

但是,GET响应不是对象Card本身,而是其他消息(包装器对象)

{ message: ".....",
  response: Card //object
}
Run Code Online (Sandbox Code Playgroud)

因此,当我保存通过资源检索的实例时,它会发送包装器对象(修改后的Card对象在响应字段中).这可能是正确的,但我的服务器期望Card对象不是包装器.有没有办法自定义$资源,以便它发送所需的对象.从doc,看起来只有url参数可以更改.

$resource(url[, paramDefaults][, actions]);
Run Code Online (Sandbox Code Playgroud)

bre*_*rge 17

我也遇到过$ resource模块中标准实现的问题.有一段时间我只是在我自己的$ resource文件的本地副本中进行了编辑,但我发现我仍然不满意他们实现REST资源的方式.我需要比提供的更多的灵活性.

标准的$ resource模块只是$ http的工厂包装器.如果你简化$ resource模块中的代码,你可以很容易地创建自己的自定义实现.

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

app.factory('CreditCard', ['$http', function($http) {

    function CreditCardFactory() {

        function parseMessage(message) {
            if (message.response) {
                return message.response;
            }
        }

        function CreditCard(value) {
            angular.copy(value || {}, this);
        }

        CreditCard.$get = function(id) {
            var value = this instanceof CreditCard ? this : new CreditCard();
            $http({
                method: 'GET',
                url: '/creditcards/' + id
            }).then(function(response) {
                var data = response.data;
                if (data) {
                    angular.copy(parseMessage(data), value);
                }
            });
            return value;
        };

        CreditCard.prototype.$get = function(id) {
            CreditCard.$get.call(this, id);
        };

        return CreditCard;

    }

    return CreditCardFactory;

}]);
Run Code Online (Sandbox Code Playgroud)

然后,在您的控制器功能中,像$ resource一样注入CreditCard工厂.

app.controller('CreditCardCtrl', function($scope, CreditCard) {
    $scope.creditCard = CreditCard().get(3);
});
Run Code Online (Sandbox Code Playgroud)

这使您可以根据需要解析REST操作的响应,并允许您实现所需的任何操作.例如:我想在我的资源上使用一个save方法,在选择使用POST(在没有id可用时创建新资源)或PUT(在a时更新现有资源)之前检查该对象是否具有id属性.有效身份证明可用).

这也允许您实现处理JSON CSRF漏洞的不同方法.angular.js方法内置于$ http中,但我公司的REST API通过将JSON数组包装在虚拟对象中来解决此问题.我使用像上面那样的自定义资源来解析虚拟对象.