Angularjs 如何将toaster库注入日志模块,而不会在异常处理程序中出现循环依赖项错误

Angularjs 如何将toaster库注入日志模块,而不会在异常处理程序中出现循环依赖项错误,angularjs,Angularjs,我已将AngularJS Toaster库添加到我的index.html中: <link href="lib/angularjs-toaster/toaster.min.css" rel="stylesheet" /> <script src="lib/angularjs-toaster/toaster.min.js"></script> <toaster-container toaster-options="{'position-class':

我已将AngularJS Toaster库添加到我的index.html中:

<link href="lib/angularjs-toaster/toaster.min.css" rel="stylesheet" />
<script src="lib/angularjs-toaster/toaster.min.js"></script>
<toaster-container 
  toaster-options="{'position-class': 'toast-bottom-center'}">
</toaster-container>
但是当我这样做时,我从注入器得到一个循环依赖性错误:
uncaughterror:[$injector:cdep]

我做错了什么

编辑 我发现问题与我使用的异常处理程序有关:

//code lifted from https://github.com/johnpapa/ng-demos (modular)
(function () {
    'use strict';

    angular
        .module('blocks.exception')
        .provider('exceptionHandler', exceptionHandlerProvider)
        .config(config);

    function exceptionHandlerProvider() {
        /* jshint validthis:true */
        this.config = {
            appErrorPrefix: undefined
        };

        this.configure = function (appErrorPrefix) {
            this.config.appErrorPrefix = appErrorPrefix;
        };

        this.$get = function () {
            return { config: this.config };
        };
    }

    function config($provide) {
        $provide.decorator('$exceptionHandler', extendExceptionHandler);
    }

    //function extendExceptionHandler($delegate, exceptionHandler, logger) {
    function extendExceptionHandler($delegate, exceptionHandler) {
        return function (exception, cause) {
            var appErrorPrefix = exceptionHandler.config.appErrorPrefix || '';
            var errorData = { exception: exception, cause: cause };
            var logMessage = appErrorPrefix + exception.message;
            $delegate(exception, cause);

            //logger.error(logMessage, errorData);
        };
    }
})();

通过注释日志记录器的使用,我可以在其他地方使用日志记录。但我也想在这里使用我的记录器。那么到底发生了什么以及如何修复它呢?

我想这是因为您正在从
app
模块调用模块依赖项,但实际上您正在
块上使用它。logger

angular.module('blocks.logger', ['toaster']);
而不是

 // remove toaster dependency
 angular.module('app', ['toaster','blocks.logger',/*etc*/]);

我在异常处理程序中找到了一个解决方案-使用
$injector

//blocks/exception/exception.module.js
(function () {
    'use strict';
    angular.module('blocks.exception', ['blocks.logger']);
})();

//blocks/exception/exceptionHandlerProvider.js
(function () {
    'use strict';

    angular
        .module('blocks.exception')
        .config(exceptionConfig);

    exceptionConfig.$inject = ['$provide'];

    function exceptionConfig($provide) {
        $provide.decorator("$exceptionHandler", exceptionHandler);
    }

    exceptionHandler.$inject = ['$delegate', '$injector'];

    function exceptionHandler($delegate, $injector) {
        return function (exception, cause) {
            var logger = $injector.get('logger');
            logger.error(exception.message);
            $delegate(exception, cause);
        };
    }

})();
参考资料:


我已经采纳了您的建议,现在发现我的问题在于异常处理程序-请参阅我的编辑
//blocks/exception/exception.module.js
(function () {
    'use strict';
    angular.module('blocks.exception', ['blocks.logger']);
})();

//blocks/exception/exceptionHandlerProvider.js
(function () {
    'use strict';

    angular
        .module('blocks.exception')
        .config(exceptionConfig);

    exceptionConfig.$inject = ['$provide'];

    function exceptionConfig($provide) {
        $provide.decorator("$exceptionHandler", exceptionHandler);
    }

    exceptionHandler.$inject = ['$delegate', '$injector'];

    function exceptionHandler($delegate, $injector) {
        return function (exception, cause) {
            var logger = $injector.get('logger');
            logger.error(exception.message);
            $delegate(exception, cause);
        };
    }

})();