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

我建议不要在视图中使用复杂的逻辑。为什么不直接处理控制器或服务中的逻辑？

即。在您的控制器中，您可以将“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保存和读取数据，因为这样可以在将来的日期更轻松地将localStorage交换为任何不同的存储介质

P.S。口袋妖怪的复数形式是口袋妖怪：P也许你可以重命名它pokemonItem in pokemonList。

有没有办法检查ngif中的localStorage变量（AngularJS）

1 个答案: