* @ngdoc controller
* @name app.rest.controller:Rest
*
- * @requires $location
- * @requires app.rest.cars
+ * @requires $modal
+ * @requires $timeout
+ * @requires app.rest.rest
*
* <p>
* <br>
- * {@link https://docs.angularjs.org/api/ng/service/$location $location}
+ * {@link http://angular-ui.github.io/bootstrap/#/modal $modal}
+ * {@link https://docs.angularjs.org/api/ng/service/$timeout $timeout}
* </p>
*
* @description
* Rest controller.
*/
/* @ngInject */
- function Rest($log, cars) {
+ function Rest($modal, $timeout, rest) {
var vm = this;
vm.example = {
text: 'try to send data',
function getCars() {
// ES6 way. success and error are deprecated because they are not following the ES6 way.
- cars.getAll().then(
+ rest.getAll().then(
// Success
function (value) {
vm.cars = value;
},
// Error
function(reason) {
- $log.debug('Rest controller error: ' + reason);
+ console.log('Rest controller error: ' + reason);
+ doModal('lg');
}
);
}
+
+ function doModal(size) {
+ var cars = ['car1', 'car2', 'car3'];
+ var modalInstance = $modal.open({
+ animation: true,
+ templateUrl: 'app/rest/rest-error-modal.html',
+ controller: 'RestErrorModal as vm',
+ size: size,
+ backdrop: 'static',
+ keyboard: false,
+ resolve: {
+ cars: function () {
+ return cars;
+ }
+ }
+ });
+
+ modalInstance.result.then(function (selectedItem) {
+ vm.selected = selectedItem;
+ }, function (reason) {
+ if (reason === '$uibUnscheduledDestruction') {
+ console.log('Modal\'s scope destroyed by unexpected mechanism');
+ }
+ console.log('Modal dismissed at: ' + new Date());
+ console.log('Modal dismissed reason: ' + reason);
+ });
+
+ modalInstance.opened.then(function(value) {
+ console.log('Modal opened success at: ' + new Date());
+ console.log('Modal opened success value: ' + value);
+ }, function(reason) {
+ console.log('Modal opened error at: ' + new Date());
+ console.log('Modal opened error value: ' + reason);
+ });
+
+ modalInstance.rendered.then(function(value) {
+ console.log('Modal rendered success at: ' + new Date());
+ console.log('Modal rendered success value: ' + value);
+ }, function(reason) {
+ console.log('Modal rendered error at: ' + new Date());
+ console.log('Modal rendered error value: ' + reason);
+ });
+
+ $timeout(modalInstance.close('closed by tiemout'), 5000);
+
+ $timeout(modalInstance.dismiss('closed by tiemout'), 10000);
+ }
}
})();
angular
.module('app.rest')
- .factory('cars', cars);
+ .factory('rest', rest);
/**
* @ngdoc service
- * @name app.rest.cars
+ * @name app.rest.rest
*
* @requires $http
- * @requires $log
+ * @requires $q
*
* <p>
* <br>
* {@link https://docs.angularjs.org/api/ng/service/$http $http} <br>
- * {@link https://docs.angularjs.org/api/ng/service/$log $log}
+ * {@link https://docs.angularjs.org/api/ng/service/$q $q}
* </p>
*
* @description
* Rest service.
*/
/* @ngInject */
- function cars($http, $log, $q, API) {
+ function rest($http, $q, API) {
return {
getAll: getAll
};
/**
* @ngdoc method
* @name getAll
- * @methodOf app.rest.cars
+ * @methodOf app.rest.rest
*
* @description
* Get cars from API REST.
// .error(errorAlternative)
// b) Using then from promise. ES6 way.
.then(success, error, notify)
- // Pattern: either use error callback or catch but not the same as the same time!!!!
+ // Pattern: either use error callback or catch but not both of them as the same time!!!!
// .catch(failed)
.finally(finalizer);
// In this way, then next chained promise will use just its success callback. :(
// What means, promise will be resolved immediately!!! If it is what you want go ahead.
- //return resp.data;
+ // return resp.data;
// Better return promise. :) Two options:
// DO NOT USE IT!!! This way has been deprecated because it is not the ES6 way.
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);
+ console.log('XHR SuccessAlternative for getAll. SuccessAlternative, data: ' + data);
+ console.log('XHR SuccessAlternative for getAll. SuccessAlternative, status: ' + status);
+ console.log('XHR SuccessAlternative for getAll. SuccessAlternative, headers (it is a function): ' + headers);
+ console.log('XHR SuccessAlternative for getAll. SuccessAlternative, config: ' + config);
}
function error(reason) {
* status: 500
* statusText: "Internal Server Error"
*/
- $log.debug('XHR Error for getAll. Error: ' + reason.data);
+ console.log('XHR Error for getAll. Error: ' + reason.data);
// In this way, then next chained promise will use just its success callback. :(
// What means, promise will be resolved immediately!!! If it is what you want go ahead.
- //return resp.data;
+ // return reason.data;
// Better return promise. :) Three options:
// DO NOT USE IT!!! This way has been deprecated because it is not the ES6 way.
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);
+ console.log('XHR ErrorAlternative for getAll. ErrorAlternative, data: ' + data);
+ console.log('XHR ErrorAlternative for getAll. ErrorAlternative, status: ' + status);
+ console.log('XHR ErrorAlternative for getAll. ErrorAlternative, headers (it is a function): ' + headers);
+ console.log('XHR ErrorAlternative for getAll. ErrorAlternative, config: ' + config);
}
function notify(notification) {
- $log.debug('XHR Notification for getAll. Notification: ' + notification);
+ console.log('XHR Notification for getAll. Notification: ' + notification);
}
function failed(reason) {
* status: 500
* statusText: "Internal Server Error"
*/
- $log.debug('XHR Failed for getAll. Reason: ' + reason);
+ console.log('XHR Failed for getAll. Reason: ' + reason);
// In this way, then next chained promise will use just its success callback.
// What means, promise will be resolved immediately!!! If it is what you want go ahead.
- //return resp.data;
+ // return reason.data;
// Better return promise. :) Three options:
}
function finalizer() {
-
+ // This callback doesn't have any input parameter :(
+ console.log('XHR Finalizer for getAll.');
}
}
}
projects / JavaScriptForFun / commitdiff