AngularJS 循环依赖

Question

我正在制作一个记录器服务，通过将错误（或调试，如果启用）保存到 indexedDB 数据库来扩展 angular 的 $log 服务。代码如下：

angular.module('appLogger', ['appDatabase'])

.service('LogServices', function($log, Database) {

    // ...

    this.log = function(type, message, details) {
        var log = {};
        log.type = type
        log.context = this.context;
        log.message = message;
        log.dateTime = moment().format('YYYY-MM-DD HH:mm:ss');
        log.details = details || '';
        $log[type.toLowerCase()](log);

        if (type === 'ERROR' || this.logDebug) {
            Database.logSave(log);
        }
    };

    // ...
})

这在我的服务中按预期工作。现在的问题是我不能在数据库服务中使用我的记录器，因为它会引发循环依赖错误。我明白这个问题，但我不知道我应该如何解决它......我应该如何解决这个问题？

感谢您的帮助:-)

Answer 1

我在尝试覆盖 exceptionHandler 时遇到了这个问题

这是出现问题的代码

angular
    .factory('$exceptionHandler', ExceptionHandler);

function exceptionHandler($log, sweetAlert) {// here is the problem with injecting sweetAlert
    return function myExceptionHandler(exception, cause) {
        //logErrorsToBackend(exception, cause);
        sweetAlert.swal('Opps...', 'An error has occurred');
        $log.warn(exception, cause);
    };
}

为了修复它，我使用了injector

angular
    .factory('$exceptionHandler', ExceptionHandler);

ExceptionHandler.$inject = ['$injector']; //better for minification

function ExceptionHandler($injector) {
    var $log, sweetAlert, $translate;// use variables for caching

    return function exceptionHandler(exception, cause) {
        // Add DI here to prevent circular dependency
        $log = $log || $injector.get('$log');
        sweetAlert = sweetAlert || $injector.get('sweetAlert');
        $translate = $translate || $injector.get('$translate');
        //............
    }

这里是更多信息的链接Injecting $http results in a Circular dependency

希望对你有帮助

Answer 2

请参阅this answer，尤其是Misko's blog，尤其是彼得在 cmets 中的问题，其中讨论了几乎完全相同的问题。

Misko 的回答是（使用 Java 代码）

class Database() implements DB;
class Logger(Database db);
class LoggingDatabase(Logger log, Database db) implements DB;

所以在你的应用程序中，你有

.service('Database', ...) // DO NOT inject the $log or LogServices here

.service('LogServices', function($log) {...}) // DO NOT inject Database here

.service('LoggingDB', function(Database, LogServices) {...}) 

在您需要记录数据库的应用程序的每个部分都使用 LoggingDB。 （或者是使用数据库的记录器！）

另一个想法

您在浏览器上有一个数据库是怎么回事？数据库是 $http 或 $resource 的包装器吗？如果是这种情况，我同意 ExpertSystem 在他的 2) 选项中：不要使用 $http 记录错误，因为如果错误杀死 $http 怎么办？请改用 XMLHTTPRequest。请参阅here 进行一些讨论。

Answer 3

Angular 抱怨循环依赖的原因是……嗯，有一个。
这是一条非常危险的道路，但是如果您知道自己在做什么（著名的遗言），那么有一个解决方案可以规避：

.service('LogServices', function($log, $injector) {

    // ...

    var Database;   // Will initialize it later

    this.log = function(type, message, details) {
        /* Before using Database for the first time
         * we need to inject it */
        if (!Database) { Database = $injector.get('Database'); }

        var log = {};
        log.type = type
        log.context = this.context;
        log.message = message;
        log.dateTime = moment().format('YYYY-MM-DD HH:mm:ss');
        log.details = details || '';
        $log[type.toLowerCase()](log);

        if (type === 'ERROR' || this.logDebug) {
            Database.logSave(log);
        }
    };

    // ...
})

另请参阅此short demo。