2016-06-02 5 views
0

Ich versuche, ein Objekt in LocalStorage zu speichern, aber wenn ich setItem trigger, speichert es zwei Objekte (Duplikat). Unten sind meine Codes;LocalStorage Feuer zweimal zum Speichern Objekt

html

<form class="clearBoth" ng-submit="addProject(projectInfo)"> 
     <div class="list" ng-model="projectInfo"> 
      <label class="item item-input item-stacked-label"> 
       <span class="input-label">Project Name</span> 
       <input type="text" ng-model="projectInfo.name" placeholder="PSN" required> 
      </label> 


      <label class="item item-input item-stacked-label"> 
       <span class="input-label">Host</span> 
       <input type="text" ng-model="projectInfo.host" placeholder="http://psn.com.my" required> 
      </label> 

     <label class="item item-input item-stacked-label"> 
      <span class="input-label">Instance</span> 
      <input type="text" ng-model="projectInfo.instance" placeholder="PSN" required> 
     </label> 

     </div> 


     <button class="button button-block button-positive" ng-click="addProject(projectInfo)">Block Button</button> 
     <button class="button button-block button-assertive" ng-click="removeProject()">Block Button</button> 
    </form> 

Controller

.controller("ProjectAddCtrl", function($scope) { 

    $scope.addProject = function (projectInfo) { 

     var oldItems = JSON.parse(localStorage.getItem('itemsArray')) || []; 

     $scope.projects = [{ 
     name: "", 
     host: "", 
     instance: "" 
     }]; 

    oldItems.push(projectInfo); 
    localStorage.setItem('itemsArray', JSON.stringify(oldItems)); 

}; 

    $scope.removeProject = function() { localStorage.clear(); }; 

    console.log(JSON.parse(localStorage.getItem('itemsArray'))); 


}) 

Antwort

1

Beide ng-click auf dem <button> und ng-submit auf dem <form> werden ausgelöst, und daher sehen Sie die gleichen Daten zweimal hinzugefügt werden. Sie können es beheben, indem Sie das Attribut type="button" auf der ersten Schaltfläche hinzufügen.

prüfen documentation - der Standardwert für das type Attribut ist submit und damit sowohl die click und submit Ereignisse ausgelöst werden.

+0

Besser wäre 'ng-click =" addProject (projectInfo) "' aus der Schaltfläche entfernen und Arbeit ordnungsgemäß einreichen. Machen Sie es Ytpe-Taste erlaubt nicht für die Tastatur senden – charlietfl

+0

Ah, mein Fehler. Danke dir übrigens! – fahmishah