2013-04-27 2 views
3

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

Boilded вниз код:

Контроллер:

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

Я подделал из фактического запроса Аякса, но я думаю, что общая идея должна применяться, вы можете увидеть full demo here

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

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 или что-то еще, если хотите что-то подобное.

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

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; 
      } 
     }; 
}); 

Надежда, что помогает

+0

Спасибо, красивое решение. Использование localStorage или даже что-то вроде taffyDB может быть интересным решением. Я подожду, чтобы узнать, получу ли я больше ответов, а затем награду. – lucuma

Смежные вопросы