2017-10-11 11 views
0

Ceci est une version simplifiée de mon code, mais ce dont j'ai besoin, c'est de stocker la sortie de chaque champ d'entrée dans localStorage, sans les écraser les uns les autres.localStorage en angulaire et avec des objets

Atm, ça ne fonctionne même pas. Je dois remplir les deux entrées pour que je puisse sauver quoi que ce soit.

var app = angular.module("app", []); 
 

 
app.controller("IndexController", ["$scope", function($scope) { 
 

 
    this.list = { 
 
    "mandag": {}, 
 
    "tirsdag": {} 
 
    }; 
 

 

 
    //LOCALSTORAGE 
 
    this.Save =() => { 
 
    localStorage.setItem("Ret", JSON.stringify(this.list.mandag)); 
 
    } 
 

 
    this.addFood = (day, title) => { 
 
     this.list[day] = { 
 
     "food": title, 
 
     "ingredients": [] 
 
     }; 
 
     console.log(this.list); 
 

 
    } 
 

 
    
 
    this.removeFood = (day) => { 
 
    this.list[day].food = ""; 
 
    } 
 

 
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title></title> 
 
    </head> 
 

 
    <body ng-app="app" > 
 
    <div ng-controller="IndexController as vm"> 
 
     <div ng-repeat="(day, item) in vm.list track by $index"> 
 
      <h3>{{day}}</h3> 
 
      <form class="" name="ret" ng-submit="vm.addFood(day, vm.newFood[$index]);vm.newTodo[$index] = ''"> 
 
      <input placeholder="Ædelse" type="text" id="foo" ng-model="vm.newFood[$index]" ng-disabled="item.food" value="" required/> 
 
      <button ng-disabled="ret.$invalid" ng-click="submitted=true; vm.Save()" ng-hide="submitted">Go</button> 
 
      </form> 
 
      <button ng-click="vm.removeFood(day); submitted=false" ng-show="submitted">X</button> 
 
     </div> 
 

 
    </div> 
 

 
    
 
    </body>

Codepen version

+0

quel est le vrai problème votre bouton "Go" est désactivé jusqu'à ce que vous remplissez les deux entrée droite? – jitender

+0

Essayez le codepen. C'est seulement le bouton Go correspondant qui est désactivé. –

+0

Si vous voulez les empêcher de s'écraser les uns les autres, il vous suffit de les enregistrer en tant que variables différentes. –

Répondre

0

Je fixe en supprimant le ng clic = "vm.Save()" dans le code HTML et javascript rearragning mon un peu:

this.Save =() => { 
 
     localStorage.setItem("Ret", JSON.stringify(this.list)); 
 
    } 
 

 
    this.addFood = (day, title) => { 
 
     this.list[day] = { 
 
     "food": title, 
 
     "ingredients": [] 
 
     }; 
 
     console.log(this.list); 
 

 
     this.Save(); 
 
    }