example/index.html

<!DOCTYPE html>
<html ng-app="httpBatchExample">
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<div ng-controller="mainCtrl">
    <button type="button" ng-click="callSingle();">Call Single API Method</button>
    <button type="button" ng-click="callMultiple();">Call Multiple API Methods (Which will be batched)</button>
</div>

<!--<script src="../bower_components/angular/angular.js"></script>-->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<script src="../dist/angular-http-batch.js"></script>

<!--<script src="../src/angular-http-batch.js"></script>-->
<!--<script src="../src/providers/httpBatchConfig.js"></script>-->
<!--<script src="../src/services/httpBatcher.js"></script>-->
<!--<script src="../src/config/httpBackendDecorator.js"></script>-->

<script type="text/javascript">
    var app = angular.module('httpBatchExample', [window.ahb.name]);

    app.config([
            'httpBatchConfigProvider',
            function (httpBatchConfigProvider) {
                httpBatchConfigProvider.setAllowedBatchEndpoint(
                        'http://localhost:8080',
                        'http://localhost:8080/api/batch', {
                            batchRequestCollectionDelay: 500
                        });
            }
    ]);

    app.controller('mainCtrl', [
        '$scope',
        '$http',
    function ($scope, $http) {
        $scope.callMultiple = function () {
            $http.get('http://localhost:8080/api/products').then(function (data) {
                console.log('success on batch call No.0 - ' + data.data);
            }, function (err) {
                console.log('error on batch call No.0 - ' + err);
            });

            $http.get('http://localhost:8080/api/products/2').then(function (data) {
                console.log('success on batch call No.1 - ' + data.data);
            }, function (err) {
                console.log('error on batch call No.1 - ' + err);
            });

            $http.put('http://localhost:8080/api/products', {
                Name: 'Product X',
                StockQuantity: 300
            }).then(function (data) {
                console.log('success on batch call No.2 - ' + data.data);
            }, function (err) {
                console.log('error on batch call No.2 (This is expected - just to illustrate an error in one of the batched requests) - ' + angular.fromJson(err));
            });
        };

        $scope.callSingle = function () {
            $http.get('http://localhost:8080/api/products').then(function (data) {
                console.log('success on single call No.0 - ' + data.data);
            }, function (err) {
                console.log('error on single call No.0 - ' + err);
            });
        };
    }]);
</script>

</body>
</html>