Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/database/8.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
AngularJS本地存储仅存储最后一项_Angularjs_Ionic Framework_Local Storage - Fatal编程技术网

AngularJS本地存储仅存储最后一项

AngularJS本地存储仅存储最后一项,angularjs,ionic-framework,local-storage,Angularjs,Ionic Framework,Local Storage,我在AngularJS中面临存储到本地存储的问题。我正在使用Ionic框架开发一个电子商务移动应用程序,并使用ng repeat显示产品数据。每个ion项都有产品详细信息和一个按钮,该按钮与TodoController中的addItem关联。单击该按钮,产品数据将存储到本地存储器中。然而,问题是,每当我点击一系列按钮时,只有最后一个被点击的产品会被存储在本地存储中,而上一个被点击的按钮的数据不会被存储 <a class="item item-thumbnail-left" href="#"

我在AngularJS中面临存储到本地存储的问题。我正在使用Ionic框架开发一个电子商务移动应用程序,并使用ng repeat显示产品数据。每个ion项都有产品详细信息和一个按钮,该按钮与TodoController中的addItem关联。单击该按钮,产品数据将存储到本地存储器中。然而,问题是,每当我点击一系列按钮时,只有最后一个被点击的产品会被存储在本地存储中,而上一个被点击的按钮的数据不会被存储

<a class="item item-thumbnail-left" href="#">
        <img ng-src={{product.featured_image.source}}>
        <div class="row">
            <div class="col">
                <h3><span ng-bind="product.ID"></span></h3>
                <h3><span ng-bind="product.title"></span></h3>
            </div>
        </div>
        <div class="row">
            <div class="col">
                <p>{{product.meta_fields.woo.currency_symbol}}{{product.meta_fields.woo.price}}</p>
            </div>
        </div>

        <div class="row">
            <div class="col">
                <p>Qty</p>              
                    <select ng-init="quantity = '1'" ng-model="quantity">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                    </select>
                </div>
          <div class="col"></div>
         <div class="col" ng-controller="TodoController">
            <button ng-click="addItem(product.ID, product.title,none , product.meta_fields.woo.price,  quantity)">Add Me</button>
            </div>
       </div>
    </a>

问题是在控制器中,您只在对象中传递值,而不传递键。您需要修改$scope.addItem函数

   $scope.addItem = function(id, item, size, price, quantity) {
    $scope.todos.push({
      id: id,
      item: item,
      size: size,
      price: price,
      quantity: quantity
    });
    localStorage.setItem('todos', JSON.stringify($scope.todos));
  }

另外,我还为您创建了一个plunker示例,请查看一下

确保您的localStorage中没有字符串“undefined”或undefined:

$scope.todos = (localStorage.getItem('todos')!==null && 
                localStorage.getItem('todos')!=='undefined') ? JSON.parse($scope.saved) : [];

凉的你确定这是导致问题的唯一原因吗?我只是按照你说的修改了我的代码,但仍然不起作用。您的plunker提供了非常好的结果。不,不幸的是没有错误。这可能是由于嵌套控制器造成的吗?我使用一个单独的控制器从我的远程源检索数据,并使用TodoController将数据存储到本地存储器。请在plunker中编写完整的代码。可能有什么东西被取代了。更新已选中的同一版本!没有帮助!:-
$scope.todos = (localStorage.getItem('todos')!==null && 
                localStorage.getItem('todos')!=='undefined') ? JSON.parse($scope.saved) : [];