Angular Cache $资源结果

时间:2015-03-27 04:22:42

标签: javascript angularjs caching

我正在寻找一种在角度js应用程序中缓存语言翻译的方法。

在应用程序中,有许多需要翻译的表单。为了获得可用的语言,我使用$ resource从我们的语言API中获取它们。

首先,我在应用程序运行()

上创建一个空的语言数组
angular
  .module('admin', [])
  .run(['$rootScope',
    function($rootScope) {
      $rootScope.languages = [];
    }
  )
;

然后我创建一个服务来处理翻译和语言查询

angular
  .module('admin')
  .factory('Utils', ['$rootScope', 'Language',
    function($rootScope, Language) {
      var utils = {};

      utils.getLanguages = function() {
        if ($rootScope.languages.length > 0) {
          return $rootScope.languages;
        }

        var languages = Language.query(function(data) {
          $rootScope.languages = data;
        });

        return languages;
      }

      return utils;
    }
  )
;

并在控制器中

angular
  .module('admin')
  .controller('CategoryController', ['$scope', 'Utils',
    function($scope, Utils) {
      $scope.languages = Utils.getLanguages();
    }
  ])
;

这是我缓存$ resource结果的方式。 您对此解决方案有何看法? 可以在$ rootScope中缓存吗?

我想缓存结果的原因是因为我需要大多数控制器中的语言,因此我不想在每次访问新状态时都要求语言API。

1 个答案:

答案 0 :(得分:1)

您可以对实施进行一些改进。

您不需要使用$rootScope来保存语言,然后通过服务公开它。您可以很好地使用服务并将结果缓存在服务中。

这样的事情应该是更好的选择

angular.module('admin')
    .factory('LanguageCache', ['$rootScope', 'Language',
function ($rootScope, Language) {
    var service = {};
    var cache;

    service.getLanguages = function () {
        if (cache) {
            return cache;
        }

        var languages = Language.query(function (data) {
            cache = data;
        });

        return cache;
    }

    return service;
});

这样,语言缓存将可用于需要它的服务。它不会污染全局$rootScope对象。