JSFiddle - React, Tailwind, and code Playground

by adamdbradley

HTML

<script src="http://code.angularjs.org/angular-1.0.0rc8.js"></script>
<script src="http://code.angularjs.org/1.0.0rc8/angular-resource-1.0.0rc8.js"></script>
<div ng-controller="MyCtrl">
    <button ng-click="testErrorService()">Test Error</button>
    <button ng-click="testSuccessService()">Test Success</button>
</div>

JavaScript

var myApp = angular.module('myApp', ['myService'], function(){})
    .config(function ($httpProvider) {
        $httpProvider.responseInterceptors.push('httpInterceptor');
     });


function MyCtrl($scope, TestError, TestSuccess) {

    $scope.testErrorService = function() {
        TestError.get( { id: 'json' }, 
            function(rsp_msg){
                alert('errorFunc rsp success ' + rsp_msg.status);
            }, 
            function(rsp_msg){
                alert('errorFunc rsp error ' + rsp_msg.status);
            }
         );
    };
    
    $scope.testSuccessService = function() {
        TestSuccess.get( { id: 'json' },
            function(rsp_msg){
                alert('successFunc rsp success');
            }, 
            function(rsp_msg){
                alert('successFunc rsp error');
            }
         );
    };
    
}

myApp.factory('httpInterceptor', function ($q) {
    
    function success(response) {
         return response;
    }
    
    function error(response) {
        var status = response.status;

        if(status == 404) { // simulate 500
            alert('Big time error');
            var deffered = $q.defer();
            return deffered.promise;
        }
        
        return $q.reject(response);
    }    
    
    return function (promise) {
        return promise.then(success, error)
    }

});
        
angular.module('myService', ['ngResource'])

    .factory('TestError', function($resource) {
        return $resource('/error-response/:id/');
    })
    
    .factory('TestSuccess', function($resource) {
        return $resource('/echo/:id/');
    });