JSFiddle - React, Tailwind, and code Playground

by wailqill

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js"></script>
<div ng-app="app"></div>

<fieldset>
    <legend>.error + .catch</legend>
    Expected: null. No data is sent in the body of the 404.
    <textarea id="a1"></textarea>
    Expected: 'custom'
    <textarea id="a2"></textarea>
 </fieldset>

<fieldset>
    <legend>.catch + .catch</legend>
    Expected: http object.
    <textarea id="b1"></textarea>
    Expected: 'custom'
    <textarea id="b2"></textarea>
 </fieldset>

CSS

textarea {
    display: block;
    width: 100%;
    height: 100px;
}

JavaScript

angular.module('app', []).run(function($http, $q) {
    $http.get('http://example.com/nothing/here.json')
    .error(function(reason) {
        a1.value = JSON.stringify(reason);
        return $q.reject('custom');
    })
    .catch(function(reason) {
        a2.value = JSON.stringify(reason);
    });
    
    $http.get('http://example.com/nothing/here.json')
    .catch(function(reason) {
        b1.value = JSON.stringify(reason);
        return $q.reject('custom');
    })
    .catch(function(reason) {
        b2.value = JSON.stringify(reason);
    });
});