[英]How to add the objects into an array stored in local storage using angular js?
我正在嘗試使用角度推功能,但是它不起作用。
我每次將新對象替換舊對象時都會將表單值存儲到本地存儲中...
我想將字符串(或對象)添加到數組中。
以下是我的HTML代碼:
<form name="myForm" novalidate>
<p> Username:<br>
<input type="text" name="user" ng-model="user.user" required>
<span ng-show="myForm.user.$pristine"/>
</p>
<p>Email:<br>
<input type="email" name="email" ng-model="user.email" required>
<span style="color:red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
<span ng-show="myForm.email.$error.required">Email is required.</span>
<span ng-show="myForm.email.$error.email">Invalid email address.</span>
</span>
</p>
<p> PhoneNum:<br>
<input type="number" name="PhoneNum" ng-model="user.PhoneNum" required>
<span ng-show="myForm.PhoneNum.$pristine"></span>
</p>
<p>Address:<br>
<input type="text" name="address" ng-model="user.address" required>
<span ng-show="myForm.address.$pristine"></span>
</p>
<p>Password:<br>
<input type="Password" name="pass" ng-model="user.pass" required>
<span ng-show="myForm.pass.$pristine" />
</p>
<p>
<input type="submit" ng-click="addItem(user)" ng-disabled="myForm.$invalid">
</p>
</form>
<pre>user = {{user | json}}</pre>
<table>
{{userdata}}
<tr>
<td>user</td>
<td>Email</td>
<td>Phone</td>
<td>Address</td>
<td>Password</td>
</tr>
<tr ng-repeat="x in userArray">
<td>{{x.user}}</td>
<td>{{x.email}}</td>
<td>{{x.PhoneNum}}</td>
<td>{{x.address}}</td>
<td>{{x.pass}}</td>
</tr>
</table>
以下是我的js代碼:
var app = angular.module("myApp", ['ngRoute','ngStorage']);
app.controller("userCtrl",['$scope','$localStorage','$log',function($scope,$localStorage,$log){
$scope.userArray=[];
$scope.userdata=$localStorage.data;
$scope.addItem=function(user){
//var current=$localStorage.data;
//$scope.userArray=userArray.concat(user);
$log.log($scope.userArray);
$scope.userArray.push(user);
$localStorage.data=$scope.userArray;
$scope.userdata=$localStorage.data;
}
}]);
數據將存儲在本地存儲中
但是每次我單擊按鈕時,它都會覆蓋本地存儲中的數據。
有人知道怎么做這個嗎?
在將userArray壓入后,您必須先清除用戶對象
$scope. user = {};
這是鏈接Jsfiddle演示
$scope.addItem = function(user) {
$scope.userArray.push(user);
$scope.user = {};
$localStorage.data = $scope.userArray;
$scope.userdata = $localStorage.data;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.