Кэширование данных с шаблоном $ resource promises

Предполагая, что мой сервис возвращает обещание от $ resource get, мне интересно, является ли это правильным способом кэширования данных. В этом примере, после нажатия стрелки назад и возврата к результатам поиска, я не хочу снова запрашивать веб-сервер, так как они у меня уже есть. Является ли это подходящей моделью, чтобы справиться с этой ситуацией? Ниже приведен пример запроса Api Flixter (Rotten Tomatoes).

Закипело код:

Контроллер: 

function SearchCtrl($scope, $route, $routeParams, $location, DataService) {
    DataService.search($routeParams.q).then(function(data){
       $scope.movies = data.movies;
    });
}

Обслуживание: 

angular.module('myApp.services', []).
 factory('DataService', ['$q', '$rootScope', 'JsonService', function ($q, $rootScope, JsonService) {

  var movie = {};
  var searchResults = {};
  var searchq = '';
  var service = {

    search: function(q) {

        var d = $q.defer();
        // checking search query, if is the same as the last one, 
        //resolve the results since we already have them and don't call service
        // IS THIS THE CORRECT PATTERN
        if (q==searchq) {
           d.resolve(searchResults);              
        } else {
          // returns a $resource with defined getdata
          JsonService.search.movieSearch(q, 20, 1).getdata(function(data){
            searchResults = data;
            searchq = q;
            d.resolve(searchResults);
          });
        }
       return d.promise;

    },
      getSearchResults: function() {
        return searchResults;
      }
 };

 return service;
 }]);

Я не могу предоставить рабочий пример, так как он будет раскрывать мой ключ API.

1 3
angularjs angular-resource

1 ответ:

Я подделал фактический запрос ajax, но я думаю, что общая идея должна применяться, вы можете увидеть полную демонстрацию здесь

Вот контроллер, он просто выполняет поиск, а затем устанавливает результаты: 

myApp.controller('MyCtrl', function($scope, DataService) {
     $scope.search = function(){
          DataService
              .search($scope.q)
              .then(function(response){
                  $scope.fromCache = response.fromCache;
                  $scope.results = response.results;
              });
      };
});

В DataService я просто сохраняю результаты в объект, отключенный от запроса. Это упрощенно, но, надеюсь, поможет вам начать. Вы можете сохранить его в хранилище html5 или что-то еще, если хотите что-то подобное.

Вам нужно будет поместить в ваш фактический Аякс звонит сюда,но принцип остается.

myApp.factory('DataService', function($q){
      var resultsCache = {};
      return {
          search: function(query){
              var deferred = $q.defer();
              if (resultsCache[query]) {
                  resultsCache[query].fromCache = true;
              }
              else {
                  resultsCache[query] = {results: [{name: 'result one'}, {name: 'result two'}]};
              }
              deferred.resolve(resultsCache[query]);
              return deferred.promise;
          }
      };
});

Надеюсь, что это поможет

1