From: Gustavo Martin Morcuende <gu.martinm@gmail.com>
Date: Wed, 26 Aug 2015 20:12:13 +0000 (+0200)
Subject: showcase: working with promises
X-Git-Url: https://git.gumartinm.name/?a=commitdiff_plain;h=27feaf36792ee6250103ffd5e8628a694ce4b285;p=JavaScriptForFun

showcase: working with promises
---

diff --git a/angularjs/showcase/src/showcase/app/rest/rest.controller.js b/angularjs/showcase/src/showcase/app/rest/rest.controller.js
index 5e34c09..a03d8cb 100644
--- a/angularjs/showcase/src/showcase/app/rest/rest.controller.js
+++ b/angularjs/showcase/src/showcase/app/rest/rest.controller.js
@@ -32,7 +32,11 @@
     vm.cars = undefined;
 
     function getCars() {
-      vm.cars = cars.getAll();
+      cars.getAll().then(function (data) {
+        // Because cars service swallows errors my success function will always be called even when error.
+        // Alternative: using $q.reject when errors in cars service?
+        vm.cars = data;
+      });
     }
   }
 
diff --git a/angularjs/showcase/src/showcase/app/rest/rest.service.js b/angularjs/showcase/src/showcase/app/rest/rest.service.js
index ca5aa43..396474f 100644
--- a/angularjs/showcase/src/showcase/app/rest/rest.service.js
+++ b/angularjs/showcase/src/showcase/app/rest/rest.service.js
@@ -37,15 +37,110 @@
      */
     function getAll() {
       return $http.get(API.CARS)
-        .then(getAllCompleted)
-        .catch(getAllFailed);
+        // a) Using success and error from promise. They are deprecated. DO NOT USE THEM!!!
+        //    https://github.com/angular/angular.js/commit/a8f7e9cfde82ed7eaba3a868d8acafdf57f2d76f
+        // .success(successAlternative)
+        // .error(errorAlternative)
+        // b) Using then from promise
+        .then(success, error, notify)
+        // catch will be called when there is no error function. In this case it will never be called
+        // because we already have the error function.
+        .catch(failed);
+      // BE CAREFUL!!! If you use error function or catch, when there are errors the success method in the upper layer
+      // (my Rest controller) will be ALWAYS called. It is as if because we caught errors in this layer they won't be
+      // seen by the upper layers using this service :(
+      // Alternative: return $q.reject from errors in this layer?
 
-      function getAllCompleted(response) {
-        return response.data;
+      function success(resp) {
+        /**
+         * resp, object containing:
+         *
+         * config: Object
+         *   headers: Object
+         *     Accept: "application/json, text/plain, *!/!*"
+         *   method: "GET"
+         *   paramSerializer: ngParamSerializer(params)
+         *   transformRequest: Array[1]
+         *   transformResponse: Array[1]
+         *   url: "/api/cars"
+         * data: Array[3]
+         *   0: Object
+         *     content: "Car: 1"
+         *     id: 4
+         *   1: Object
+         *     content: "Car: 2"
+         *     id: 5
+         *   length: 2
+         * headers: function(name)
+         * status: 200
+         * statusText: "OK"
+         */
+        return resp.data;
       }
 
-      function getAllFailed(error) {
-        $log.debug('XHR Failed for sendData.' + error.data);
+      // DO NOT USE IT!!! This way has been deprecated.
+      function successAlternative(data, status, headers, config) {
+        $log.debug('XHR SuccessAlternative for getAll. SuccessAlternative, data: ' + data);
+        $log.debug('XHR SuccessAlternative for getAll. SuccessAlternative, status: ' + status);
+        $log.debug('XHR SuccessAlternative for getAll. SuccessAlternative, headers (it is a function): ' + headers);
+        $log.debug('XHR SuccessAlternative for getAll. SuccessAlternative, config: ' + config);
+      }
+
+      function error(resp) {
+        /**
+         * resp, object containing:
+         *
+         * config: Object
+         *   headers: Object
+         *     Accept: "application/json, text/plain, *!/!*"
+         *   method: "GET"
+         *   paramSerializer: ngParamSerializer(params)
+         *   transformRequest: Array[1]
+         *   transformResponse: Array[1]
+         *   url: "/api/cars"
+         * data: "Error: connect ECONNREFUSED"
+         * headers: function(name)
+         * status: 500
+         * statusText: "Internal Server Error"
+         */
+        $log.debug('XHR Error for getAll. Error: ' + resp.data);
+
+        // Should I return $q.reject instead? Right now, the success method in upper layers will always be called. :(
+        return resp.data;
+      }
+
+      // DO NOT USE IT!!! This way has been deprecated.
+      function errorAlternative(data, status, headers, config) {
+        $log.debug('XHR ErrorAlternative for getAll. ErrorAlternative, data: ' + data);
+        $log.debug('XHR ErrorAlternative for getAll. ErrorAlternative, status: ' + status);
+        $log.debug('XHR ErrorAlternative for getAll. ErrorAlternative, headers (it is a function): ' + headers);
+        $log.debug('XHR ErrorAlternative for getAll. ErrorAlternative, config: ' + config);
+      }
+
+      function notify(notification) {
+        $log.debug('XHR Notification for getAll. Notification: ' + notification);
+      }
+
+      function failed(reason) {
+        /**
+         * reason, object containing (the same as resp object for error function):
+         *
+         * config: Object
+         *   headers: Object
+         *     Accept: "application/json, text/plain, *!/!*"
+         *   method: "GET"
+         *   paramSerializer: ngParamSerializer(params)
+         *   transformRequest: Array[1]
+         *   transformResponse: Array[1]
+         *   url: "/api/cars"
+         * data: "Error: connect ECONNREFUSED"
+         * headers: function(name)
+         * status: 500
+         * statusText: "Internal Server Error"
+         */
+        $log.debug('XHR Failed for getAll. Reason: ' + reason);
+
+        return reason.data;
       }
     }
   }