工厂和服务的依赖错误

Question

使用factory，我通过在我的API 中创建ApiRequest.sendRequest 来获取用户信息：

(function() {

angular.module('isApp.user', [])

.factory('UserProfileFactory', function( $log, ApiRequest, dataUrls ) {

    var userProfile = {
        token : null,
        id : null,
        name : null,
        ifMode : null,
        justReader : true,
        debugApp : 'NO',
        didTutorial : false,
        showOnlyUnread : true,
        markAsReadOnScroll : false,
        tagLimit : null,
    };

    return {
        logIn : logIn,
        setConfigByAuthentication : setConfigByAuthentication,
        getUserProfileFromDevice : getUserProfileFromDevice,
        getUserProfile : getUserProfile,
        setDefaultUserProfile : setDefaultUserProfile,
        saveUserProfile : saveUserProfile,
        // Getters & Setters
        setToken : setToken,
        getToken : getToken,
        setId : setId,
        getId : getId,
        setName : setName,
        getName : getName,
        setIfMode : setIfMode,
        getIfMode : getIfMode,
        setJustReader : setJustReader,
        getJustReader : getJustReader,
        setDebug : setDebug,
        getDebug : getDebug,
        setDidTutorial : setDidTutorial,
        getDidTutorial : getDidTutorial,
        setShowOnlyUnread : setShowOnlyUnread,
        getShowOnlyUnread : getShowOnlyUnread,
        setMarkAsReadOnScroll : setMarkAsReadOnScroll,
        getMarkAsReadOnScroll : getMarkAsReadOnScroll,
        getTagLimit : getTagLimit
    };


    function logIn( user, passwd )
    {
        var config = {
            method: 'POST',
            url: dataUrls.main + dataUrls.login,
            headers: 
            {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            transformRequest: 
                function(data) 
                {
                    var str = [];
                    for( var attr in data )
                        str.push(encodeURIComponent(attr) + "=" + encodeURIComponent(data[attr]));
                    return str.join("&");
                },
            data: 
            { 
                username: user,
                passwd: passwd
            }
        };

        $log.info('Login Request START -url-', config.url);
        return ApiRequest.sendRequest( config ).then( 
            function (response)
            {
                if (response != undefined )
                {
                    if (response.status == 200)
                    {
                        userProfile.token = response.data.token;
                        userProfile.id = response.data.userData.id;
                        userProfile.name = response.data.userData.name;
                        userProfile.ifMode = response.data.ifmode;
                        userProfile.justReader = response.data.rights.just_reader;
                        userProfile.debugApp = response.data.debugApp;
                        userProfile.didTutorial = false;
                        userProfile.showOnlyUnread = true;
                        userProfile.markAsReadOnScroll = false;
                        localStorage.isAuthenticated = true;
                        userProfile.tagLimit = response.data.tagLimit;
                        saveUserProfile();
                        return response.status;
                    }
                }
                return response;
            },
            function (response)
            {
                return response;
            }
        );
    }

    function setToken(value)
    {
        userProfile.token = value;
        saveUserProfile();
    }

    function getToken()
    {
        return userProfile.token;
    }


});
})();

service 使用两个函数 sendRequest 和 send。 send需要通过UserProfileFactory.getToken()函数获取用户token。

拥有send和sendRequest的原因是我们最初使用sendRequest但我们想开始使用send，但是由于我们仍在对代码进行更改并且更改可能很敏感，我们仍然希望保持两者。在示例中，我们使用sendRequest，但在代码的其他部分，我们使用send，但不是在工厂中，我们只使用sendRequest，如您所见。

(function() {

angular.module('isApp.api', [])


.service('ApiRequest', function($http, $log, $q, UserProfileFactory, toaster, LanguageTexts, dataUrls) {

    this.sendRequest = sendRequest;
    this.send = send;

    function send( request )
    {   
        if (request.method == undefined) request.method = 'GET';

        if (request.header != undefined)
        {
            request.headers['Authentication'] = 'Token ' + UserProfileFactory.getToken();
        }
        else
        {
            request.headers = {};
            request.headers['Authentication'] = 'Token ' + UserProfileFactory.getToken();       
        }

        request.url = dataUrls.main + '/' + request.url;

        $log.info('Object request', request);
                return $http( request ).then( 
            function( response )
            {
                var APIResponse = response.data;
                if (typeof APIResponse != 'object')
                {
                    return $q.reject(response);
                }

                if (APIResponse.status == 200)
                {
                    return APIResponse.data;
                }
                else
                {
                    return $q.reject(response);
                }
            },
            function( response )
            {
                $log.error('HttpError: ', response.status);
                $log.error('Response complete: ', response);
                toaster.pop('error', null, LanguageTexts.errorServerError);
                return $q.reject(response);
            }       
        );
    }

    function sendRequest( request )
    {
        return $http( request ).then( 
            function( response )
            {
                $log.info('HttpResponse: ', response.data.status);
                $log.log('Response Data: ', response.data);
                if (response.data.status == undefined)
                {
                    $log.info('Response undefined: ', response);
                }
                if ( response.data.status != 200 )
                {
                    return response.data.status;
                }
                return response.data;
            },
            function( response )
            {
                if ( response.config.timeout != undefined )
                {
                    if ( response.config.timeout.$$state.value != undefined )
                    {
                        $log.warn('HttpError: ', response.status);
                        $log.warn('Promise cancel: ', response.config.timeout.$$state.value);
                        return "promise_cancel"; 
                    }
                }
                $log.error('HttpError: ', response.status);
                $log.error('Response Error Data: ', response);
                return response;
            }       
        );
    }

}]);
})();

我遇到了经典的循环依赖错误：

Error: [$injector:cdep] http://errors.angularjs.org/1.3.13/$injector/cdep?p0=UserProfileFactory%20%3C-%20ApiRequest%20%3C-%20UserProfileFactory

谁能告诉我如何重新排序我的两个文件以避免出现依赖错误？提前致谢。

Answer 1

这不是要对组件重新排序，这在结构上是不可能的：如果需要创建 ApiRequest 来创建 UserProfileFactory ，反之亦然，AngularJS 的解析器永远无法满足要创建的依赖项。

检查你的依赖关系，看看你是否可以用不同的方式构建你的代码：你的A <> B 依赖关系可以用一个新组件C 重写为A > C < B 吗？ C 将具有 A 和 B 都需要的功能。