自定义 Angular $http 序列化器

Question

如何创建自定义 $http params 序列化程序。例如，假设我正在进行以下调用：

$http({
            url: settings.API_PRODUCTS,
            method: 'GET',
            params: data,
            paramSerializer: '$httpParamSerializerJQLike'
        });

如何创建一个新的自定义序列化程序以便我能够像这样使用它：

$http({
            url: settings.API_PRODUCTS,
            method: 'GET',
            params: data,
            paramSerializer: '$httpParamCustomSerializer'
        });

我检查了 httpParamSerializerJQLike 函数是如何 written，但我不确定如何像上面那样注入和使用。

Answer 1

根据 the documentation，您可以为 paramSerializer 属性提供一个内联函数，或者您可以创建一个函数服务并使用字符串按名称引用它。

Answer 2

这应该可以，创建自定义提供程序

angular.module('yourmodule.providers').provider('$httpCustomParamSerializer', function $httpCustomParamSerializer() {

  this.$get = function() {
    return function jQueryLikeParamSerializer(params) {
      if (!params) return '';
      var parts = [];
      serialize(params, '', true);
      return parts.join('&');

    function forEachSorted(obj, iterator, context) {
        var keys = Object.keys(obj).sort();
        for (var i = 0; i < keys.length; i++) {
            iterator.call(context, obj[keys[i]], keys[i]);
        }
        return keys;
    }

    function encodeUriQuery(val, pctEncodeSpaces) {
        return encodeURIComponent(val).
                replace(/%40/gi, '@').
                replace(/%3A/gi, ':').
                replace(/%24/g, '$').
                replace(/%2C/gi, ',').
                replace(/%3B/gi, ';').
                replace(/%20/g, (pctEncodeSpaces ? '%20' : '+'));
    }

    function serializeValue(v) {
    if (angular.isObject(v)) {
        return angular.isDate(v) ? v.toISOString() : angular.toJson(v);
    }
    return v;
    }   

      function serialize(toSerialize, prefix, topLevel) {
        if (toSerialize === null || angular.isUndefined(toSerialize)) return;
        if (angular.isArray(toSerialize)) {
          angular.forEach(toSerialize, function(value, index) {
            serialize(value, prefix + '[' + (angular.isObject(value) ? index : '') + ']');
          });
        } else if (angular.isObject(toSerialize) && !angular.isDate(toSerialize)) {
          forEachSorted(toSerialize, function(value, key) {
            serialize(value, prefix +
                (topLevel ? '' : '[') +
                key +
                (topLevel ? '' : ']'));
          });
        } else {
          parts.push(encodeUriQuery(prefix) + '=' + encodeUriQuery(serializeValue(toSerialize)));
        }
      }
    };
  }

});

自定义 Angular $http 序列化器

Custom Angular $http Serializer

javascript

angularjs

angular-http