Есть ли способ проверить переменную localStorage в ngif (AngularJS)

Question

У меня есть некоторые переменные localstorage, которые я установил, когда что-то кешу.

Я хочу показать в списке с ng-repeat, что элемент был кэширован, поэтому я должен увидеть, находится ли item.name в localstorage (предположительно с элементом ng-if на элементе значка).

 <ion-list class="pokemonList"> 
      <ion-item class="item item-icon-right" ng-repeat="pokemon in pokemons | filter:search.filter" ng-click="goToPokemon(pokemon.url, pokemon.name)"> 
       {{pokemon.name | capitalize}}     
       <i class="icon ion-eye" ng-if="localStorage.getItem('pokemon.' + pokemon.name)"></i> 
      </ion-item> 
      </ion-list> 

Это, очевидно, не работает, но есть ли другой способ сделать эту работу?

Answer 1

Я бы посоветовал использовать сложную логику в представлении. Почему бы просто не обрабатывать логику в контроллере или службе?

ie. в вашем контроллере вы можете сопоставить свойство isCached для каждого элемента в вашем списке «pokemons».

Например:

angular.forEach(pokemons, function (value, key) { 
    var cacheItemName = 'pokemon.' + pokemon.name; 
    value.isCached = localStorage.getItem(cacheItemName) || false; 
    pokemons[key] = value; 
}); 

$scope.pokemons = pokemons; 

Затем, когда этот список отображается в представлении, вы просто должны сделать:

<i class="icon ion-eye" ng-if="pokemon.isCached"></i>

На самом деле, я хотел бы использовать средний-слой, как пользовательскую службу с именем CacheService для обработки данных сохранения и чтения из localStorage, поскольку это облегчит в будущем дату обмен локальным хранилищем для любого другого носителя данных.

P.S. множественная форма Pokemon - Pokemon: P Возможно, вы можете переименовать ее pokemonItem in pokemonList.