在AngularJS中缓存国际化JSON数据

Caching internationalization JSON data in AngularJS

本文关键字：JSON 数据 国际化 缓存 AngularJS      更新时间：2023-09-26

这里我在我的应用程序中创建了多语言概念，它运行良好，但每个字段都加载了语言（.json）文件，所以应用程序需要时间加载，我的要求是我只想加载一次.json来获取所有数据，如何在angularJs中完成，感谢您提前帮助

请同时查看以下链接

http://plnkr.co/edit/PYZxcI5yTNuA0fEern9s?p=preview

var language = 'en';
app.directive('telBasictext', ['$http', 'teli18nservice',
  function($http, teli18nservice) {
    return {
      restrict: 'AEC',
      require: 'ngModel',
      scope: {
        ngModel: '=',
      },
      template: '<div  class="form-group"  > ' +
        '<label  >  {{ setvalue }} </label> ' +
        '<div  > <input type="{{ textboxtype }}" ng-model="ngModel"  ></div></div>',
      link: function(scope, iElement, iAttrs, ngModelController) {
        var collecton = iAttrs.getString;
        var splitValues = collecton.split(",");
        var language = splitValues[0]; // Language EN or Fr
        var labelName = splitValues[1]; // Label Name
        var moduleName = splitValues[2]; // Module Name (global or local)
        teli18nservice.getdata(moduleName).success(function(data) {
            scope.setvalue = data[labelName];
          })
          .error(function(error) {
            scope.setvalue = "No Label";
          });
      }
    };
  }
]);

将JSON请求的结果本地存储在teli18nservice服务中，并为后续对getdata的调用返回该数据。它看起来像这样：

// teli18nservice
var jsonData;
this.getData = function () {
    if (jsonData) {
        return $q.resolve(jsonData);
    }
    $http.get().then(function (res) {
        jsonData = res.data;
        return jsonData;
    });
}

或者，看看缓存$http响应。

您可能应该使用$http的缓存。

这里的例子：

var cache = $cacheFactory('myCache');
var data = cache.get(someKey);
if (!data) {
    $http.get(url).success(function(result) {
        data = result;
        cache.put(someKey, data);
    });
}
相关文章：