Comment utiliser le filtre de valeur localStorage dans ng-repeat

Question

J'ai défini une valeur lorsque l'utilisateur clique sur le choix du vote. Ça marche.

.then(function(response) { 
    localStorage.setItem('isClicked', 'Yes'); 
    var i = +localStorage.key("nid"); 
    var nidId = 'nid' + localStorage.length; 
    localStorage.setItem(nidId, vm.nid); 
    vm.clickedBefore = true; 
}) 

Ceci est mon champ HTML:

<div class="card myfunc" ng-repeat="myfunc in myfuncPage.myfuncs" id="{{myfunc.nid}}" > 

    <div class="item item-text-wrap"> 
    <h2 class="item-icon-left"><i class="icon ion-ios-analytics"></i> 
     {{myfunc.title}}</h2> 
    </div> 
    <div class="item item-text-wrap" ng-show="localstorage"> 
     <img ng-src="{{myfunc.field_image.und[0].imgPath}}"/> 
     <p class="custom-class" ng-bind-html='myfunc.body.und[0].value'> 
     </p> 
     <ul ng-repeat="vote in myfunc.advmyfunc_choice"> 
     <li ng-repeat="voteselect in vote"> 
      <div class="row"> 
      <button class="col button button-outline button-dark" ng-click="myfuncPage.sendNid(myfunc);myfuncPage.sendVote(voteselect);showVoted = ! showVoted" >{{voteselect.choice}}</button> 
      <div class="voted-screen" ng-show="showVoted"> 
       <h3>Thanks.</h3> 
      </div>  
      </div> 
     </li> 
     </ul> 

    </div> 

    </div> 

En gros, je dois rappeler la div par localStorage et lorsque l'actualisation de la page, cacher divs choix.

ng-show="showVoted" Je travaille sur le clic mais j'ai besoin de rafraîchir.

Quelle est la meilleure façon de le faire? Merci.

Answer 1

Je ne suis pas sûr de ce que le module de stockage local que vous utilisez, donc je ne peux pas être précis, mais j'écrirait usine qui gère la récupération et le stockage des valeurs dont vous avez besoin

(function() { 
    var voteFactory = function (localStorage) { 
     return { 
      getVote: function (key) { 
       var isVoted = false; 

       // get local storage item, set voted etc 
       var voted = localStorage.getItem(key); 
       if(voted) { 
        isVoted = voted; 
       } 
       return isVoted; 

      }, 
      setVote: function(key, value) { 
       localStorage.setItem(key,value); 
      }   
     }; 
     }; 
     app.factory('voteFactory', ['localStorage', voteFactory]); 
})();  

Ensuite, dans le contrôleur de champ/directive que vous utilisez pour afficher ou masquer vous auriez une fonction:

$scope.showVoted = function(key) { 
    return voteFactory.getVote(key); 
} 

puis ng-show = "showVoted (theidentifieryouwantouse)"

Il est également moût Cependant, pour mentionner, j'utiliserais ng-if au lieu de ng-show. Pour être plus efficace, vous pouvez stocker vos votes sous forme de tableau au lieu de valeurs individuelles et vérifier si vous avez récupéré toutes les valeurs, à partir du stockage local si ce n'est pas le cas. Vos fonctions interrogeraient alors le tableau récupéré au lieu des appels répétés au stockage local. Je conseillerais aussi peut-être d'utiliser une promesse dans l'usine parce que la récupération à partir du stockage local pourrait être retardée en causant certaines irrégularités.

Espérons que cela va dans le sens de ce que vous cherchez. Je peux élaborer si nécessaire.