AngularJS-我在工厂注入中缺少什么吗？

Question

我使用$ cacheFactory在缓存中保存一些数据，直到今天我决定将自己的cacheFactory分离到一个名为MyFactory.js的类中时，一切都工作得很好。 现在我得到了错误：

TypeError: tableCacheFactory is not a function

因为将注射作为一种简单方法或其他方法，所以有人知道我是否在这里缺少什么吗？

main.js

angular.module('main-component',
    ['my-component',
    'my-cache-factory'
    ]);

MyFactory.js

angular.module('my-cache-factory', [])

    .factory('tableCacheFactory', [
        '$cacheFactory', function ($cacheFactory) {
            return $cacheFactory('my-cache');
        }
    ]);

MyService.js

angular.module('my-component', [])

    .factory('my-component-service',
        ['$rootScope',
        '$http',
        '$q',
        'tableCacheFactory',
        function ($rootScope, $http, $q, tableCacheFactory) {

            function getMyData (prodNro) {

                var deferred = $q.defer();
                var promise = deferred.promise;

                var dataCache = tableCacheFactory.get('tablecache');

                if (!dataCache) {
                    dataCache = tableCacheFactory('tablecache');  // TypeError: tableCacheFactory is not a function
                }

                var summaryFromCache = dataCache.get('tablecache' + prodNro);

                if (summaryFromCache) {
                    deferred.resolve(summaryFromCache);

                } else { 

                    $http({
                        method: ...
                        data : ...
                        url: ...
                    }).success( function (data, status, headers, config) {

                        var objectResult = {
                            "data": data,
                            "status": status,
                            "headers": headers,
                            "config": config
                        }

                        if (data.response) {
                            // Save to cache
                            dataCache.put('tablecache'+prodNro, objectResult);
                        }

                        deferred.resolve(objectResult);

                    }).error(function (data, status, headers, config) {

                        ...
                    });

                }

                return promise;

            }

Answer 1

tableCacheFactory包装在my-cache-factory模块中。 因此，在使用模块之前，需要先将模块注入到my-component模块中。 所以应该是这样的：

angular.module('my-component', ['my-cache-factory'])

Answer 2

您在my-cache-factory模块中定义了缓存工厂，但是从未将该模块注入到主组件服务模块中。 angular.module('my-component', ['my-cache-factory'])执行angular.module('my-component', ['my-cache-factory']) 。

Answer 3

您似乎对$cacheFactory工作方式有一些误解。

在var dataCache = tableCacheFactory.get('tablecache'); 您正在使用它，就像它是包含另一个Cache对象的已初始化Cache对象一样。

另一方面， dataCache = tableCacheFactory('tablecache'); 使用它就像$cacheFactory本身一样。

他们两个都尝试以我认为应该已经是tableCache本身的方式访问记录“ tablecache”。

该错误正是它所说的。 根据文档 ，调用$cacheFactory('my-cache'); 不返回创建更多缓存的功能。 它返回一个$cacheFactory.Cache对象，该对象具有诸如put(key, value)和get(key) 。 改用那些。

我会更改缓存的整个结构（请注意，工厂名称已更改） ：

.factory('tableCache', [
    '$cacheFactory', function ($cacheFactory) {
        //Return what the name of the factory implies
        return $cacheFactory('tablecache');
    }
]);

然后使用它，而无需执行更多奇怪的“ tablecache”命名间隔

function getMyData (prodNro) {
    ...
    var summaryFromCache = tableCache.get(prodNro);
    ...
    tableCache.put(prodNro, objectResult);
}