ng-demos
ng-demos copied to clipboard
Circular dependency
Hi
I liked you concept of blocks.logger and blocks.exception, and am trying to implement this into our application. I'm using the files from "modular".
The extended exception handler throws an error though:
Uncaught Error: [$injector:cdep] Circular dependency found: $exceptionHandler <- $$q <- $animate <- toastr <- logger <- $exceptionHandler <- $rootScope
If i remove the call to logger in here, it's fine: https://github.com/johnpapa/ng-demos/blob/9a9cbb2a44bf8530906b961171a9c1f2ef4ad596/modular/src/client/app/blocks/exception/exception-handler.js#L38
Any ideas?
I had this same problem. I got around it by using $injector
to fetch the logger
.
extendExceptionHandler.$inject = ['$delegate', '$injector', 'exceptionHandler'];
/**
* Extend the $exceptionHandler service to also display a toast.
* @param {Object} $delegate
* @param {Object} exceptionHandler
* @param {Object} logger
* @return {Function} the decorated $exceptionHandler service
*/
function extendExceptionHandler($delegate, $injector, exceptionHandler) {
return function (exception, cause) {
var appErrorPrefix = exceptionHandler.config.appErrorPrefix || '';
var errorData = {
exception: exception,
cause: cause
};
exception.message = appErrorPrefix + exception.message;
$delegate(exception, cause);
/**
* Could add the error to a service's collection,
* add errors to $rootScope, log errors to remote web server,
* or log locally. Or throw hard. It is entirely up to you.
* throw exception;
*
* @example
* throw { message: 'error message we added' };
*/
var logger = $injector.get('logger');
logger.error(exception.message, errorData);
};
}
@elebetsamer That helped me . Thank you
Hi, also had the same problem. by the way if you look at the presentation in youtube of jhon-papa you will notice he didn't use the same code there. the solution: in order to avoid attaching the toast service to the rootScope (this is what causes the problem), i wanted to attach the toast service to the module.config function. BUT, angular doesn't allow using services at the configuration run. so you must use the service provider here. Hope this solution suits for you
(function() {
angular.module('myApp', ['toastr']).config(['$provide', 'toastrProvider', function($provide, toastrProvider {
$provide.decorator('$exceptionHandler', function($delegate) {
return function(exception, cause) {
$delegate(exception, cause);
toastrProvider.$get().error(exception.message, 'Error!');
};
});
}]);
})();
@mordajon Hello mordajon, could you please kindly share the youtube presentation you were referring to? I tried to search for it, but came back nothing. Thank you.
Hey @j1wu, I think it is this one: https://www.youtube.com/watch?v=UlvCbnKAH3g