JSFiddle - React, Tailwind, and code Playground

by gadr

HTML

<script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
<div ng-app="app" ng-controller="Controller" class="container">
    <h4>Angular calls success, no matter the HTTP code</h4>
    <small>... if your interceptor doesnt reject the rejection!</small>
    <br/>
    <br/>
    <button ng-click="get200()">GET 200</button>
    <button ng-click="get404()">GET 404</button>
    <button ng-click="get500()">GET 500</button>
    <p ng-show="success">Success!</p>
    <p ng-show="error">Error!</p>
    <p>{{data}}</p>
</div>

JavaScript

angular.module("app", []).config(function($httpProvider){
    $httpProvider.interceptors.push(function($q) {
      return {
       'responseError': function(rejection) {
          console.log("We need to $q.reject it!");
          //return $q.reject(rejection);
          return rejection;
        }
      }
    })
});

function Controller($scope, $http) {
    $scope.success = $scope.error = false;
    $scope.getCode = function (code) {
        $http.get('http://httpstat.us/' + code).then(

        function (data) {
            $scope.success = true;
            $scope.error = false;
            $scope.data = data
        },

        function (reason) {
            $scope.success = false;
            $scope.error = true;
            $scope.data = reason
        });
    }
    $scope.get200 = function () {
        return $scope.getCode(200)
    };
    $scope.get404 = function () {
        return $scope.getCode(404)
    };
    $scope.get500 = function () {
        return $scope.getCode(500)
    };

}