如何以角度扩展$ http服务?

时间:2022-08-22 21:21:58

Unfortunately, we're stuck running 1.2.26 (will upgrade to 1.2.28 when it's gemified).

不幸的是,我们遇到了1.2.26(当它被篡改时会升级到1.2.28)。

In the meantime, how can I patch (heh) $http so that the short-hand patch method is available? I'm pretty new to the whole service/factory/module thing. I've done hours of searching and can't seem to figure it out.

在此期间,我如何修补(heh)$ http以便可以使用短手补丁方法?我对整个服务/工厂/模块的事情都很陌生。我已经做了几个小时的搜索,似乎无法搞清楚。

myApp.factory('patchedHTTP', function($http, BasicService) {
  // $http['patch'] = function(url, data, config) {
  //   return $http(angular.extend(config || {}, {
  //     method: 'patch',
  //     url: url,
  //     data: data
  //   }));
  // };
  var extended = angular.extend(BasicService, {});
  extended.createShortMethodsWithData('patch');
  return extended;
});

Above is the best I've got... and it doesn't do anything XD

以上是我得到的最好的......它没有做任何XD

2 个解决方案

#1


3  

The module.decorator has been added to the module API in version 1.4. That's why it is not working in 1.2.x.

module.decorator已添加到1.4版的模块API中。这就是它在1.2.x中不起作用的原因。

Please find below a working demo or here at jsfiddle.

请在下面找到一个工作演示或在jsfiddle。

It took me a while to implement the patch method because I've missed to return the promise of $http. But now it should be working.

我花了一段时间来实现补丁方法,因为我错过了返回$ http的承诺。但现在它应该工作。

angular.module('patchDemo', [])
.config(function ($provide) {

    $provide.decorator('$http', function ($delegate) {
        // NOTE: $delegate is the original service
		$delegate.patch = function(url, data, config) {
            var paramsObj = angular.extend({}, config || {}, {
                method: 'PATCH',
                url: url,
                data: data
            });

            return $delegate(paramsObj);
        }
		
        return $delegate;
    });
})
.controller('MainController', MainController);

function MainController($http) {
    console.log($http.patch);
    //$http({method: 'PATCH', url: 'http://jsonplaceholder.typicode.com/posts/1', data: {title:'foo'}}); //>>>>>working long version of patch

    $http.patch('http://jsonplaceholder.typicode.com/posts/1', {
        title: 'foo'
    }).then(function(response) {
    	console.log(response);
    });

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.26/angular.js"></script>
<div ng-app="patchDemo" ng-controller="MainController"></div>

#2


4  

You can do this with an angular decorator.

你可以用角度装饰器做到这一点。

A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service. For more information you can check angular documentation.

服务装饰器拦截服务的创建,允许它覆盖或修改服务的行为。装饰器返回的对象可以是原始服务,也可以是替换或包装并委托给原始服务的新服务对象。有关更多信息,您可以检查角度文档。

Example:

var app = angular.module('app');
app.decorator('$http', function ($delegate) {
  // NOTE: $delegate is the original service

  $delegate.patch = function () {
    // do the implementation here
  };

  return $delegate;
});

// usage
app.controller('SomeController', function($http) {
    $http.patch();
});

You can keep this decorator until you upgrade to some newer version and than just safely delete it.

您可以保留此装饰器,直到升级到某个较新版本,而不是安全地删除它。

#1


3  

The module.decorator has been added to the module API in version 1.4. That's why it is not working in 1.2.x.

module.decorator已添加到1.4版的模块API中。这就是它在1.2.x中不起作用的原因。

Please find below a working demo or here at jsfiddle.

请在下面找到一个工作演示或在jsfiddle。

It took me a while to implement the patch method because I've missed to return the promise of $http. But now it should be working.

我花了一段时间来实现补丁方法,因为我错过了返回$ http的承诺。但现在它应该工作。

angular.module('patchDemo', [])
.config(function ($provide) {

    $provide.decorator('$http', function ($delegate) {
        // NOTE: $delegate is the original service
		$delegate.patch = function(url, data, config) {
            var paramsObj = angular.extend({}, config || {}, {
                method: 'PATCH',
                url: url,
                data: data
            });

            return $delegate(paramsObj);
        }
		
        return $delegate;
    });
})
.controller('MainController', MainController);

function MainController($http) {
    console.log($http.patch);
    //$http({method: 'PATCH', url: 'http://jsonplaceholder.typicode.com/posts/1', data: {title:'foo'}}); //>>>>>working long version of patch

    $http.patch('http://jsonplaceholder.typicode.com/posts/1', {
        title: 'foo'
    }).then(function(response) {
    	console.log(response);
    });

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.26/angular.js"></script>
<div ng-app="patchDemo" ng-controller="MainController"></div>

#2


4  

You can do this with an angular decorator.

你可以用角度装饰器做到这一点。

A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service. For more information you can check angular documentation.

服务装饰器拦截服务的创建,允许它覆盖或修改服务的行为。装饰器返回的对象可以是原始服务,也可以是替换或包装并委托给原始服务的新服务对象。有关更多信息,您可以检查角度文档。

Example:

var app = angular.module('app');
app.decorator('$http', function ($delegate) {
  // NOTE: $delegate is the original service

  $delegate.patch = function () {
    // do the implementation here
  };

  return $delegate;
});

// usage
app.controller('SomeController', function($http) {
    $http.patch();
});

You can keep this decorator until you upgrade to some newer version and than just safely delete it.

您可以保留此装饰器,直到升级到某个较新版本,而不是安全地删除它。