AngularJs: saving data locally in angularJs

Question

i have a project am working about a shopping list and am making in such a way that the user types the item he wants to add and whenever he adds it displays that he has dded a particular product and not to forget he has the ability to remove any product from the list. But when never i reload the page it displays empty even though i already added some item previously..this is the code

var app =  angular.module("shoppingList",[]);
      app.controller("myCtrl",function($scope){
          $scope.goods = []

          var taskData = localStorage()


          $scope.addItem = function(){
              $scope.errorText = "";
              if(!$scope.addNew){return;}
              if($scope.goods.indexOf($scope.addNew) == -1){
                       $scope.goods.push($scope.addNew);  
              }else{
                  $scope.errorText = "The Item is already in your shopping list"
              }

          };

          $scope.removeItem = function(x){
              $scope.errorText = ""
              $scope.goods.splice(x,1);
          }

      })

try http://stackoverflow.com/a/14266748/5689728, this might help — Owen Hsieh, May 31 '16 at 08:29
You will need to provide more information. What is $scope.addNew? Are you trying to save the list to localStorage? — Seonixx, May 31 '16 at 08:30

score 0 · Accepted Answer · answered May 31 '16 at 08:52

It is a good idea to use https://github.com/gsklee/ngStorage in your app, because it will let you use localstorage the angular way. so to rewrite your code with ngStorage:

 var app =  angular.module("shoppingList",['ngStorage']);
  app.controller("myCtrl",function($scope,$localStorage){
      $scope.goods = $localStorage.goods || [];

      var taskData = localStorage()


      $scope.addItem = function(){
          $scope.errorText = "";
          if(!$scope.addNew){return;}
          if($scope.goods.indexOf($scope.addNew) == -1){
                   $scope.goods.push($scope.addNew);  
                   $localStorage.goods.push($scope.addNew);
          }else{
              $scope.errorText = "The Item is already in your shopping list"
          }

      };

      $scope.removeItem = function(x){
          $scope.errorText = ""
          $scope.goods.splice(x,1);
          $localStorage.goods.splice(x,1);
      }

  })

hope this works for you

AngularJs: saving data locally in angularJs

1 Answers1