如何使用本地存储将数据发送到另一个HTML文件（NOT SPA）-angularjs
[英]How to use localstorage to send data into another html file(NOT SPA) - angularjs
问题描述
I am not using SPA app, so if i click another html file the page loads, so i cant catch the data, i want to store in that localstorage. 
我没有使用SPA应用程序，因此，如果我单击页面加载的另一个html文件，则无法捕获数据，我想存储在该localstorage中。
This is my controller file: 这是我的控制器文件：
angular
.module('myApp', [])
.controller('myController', function($scope, $rootScope) {
$scope.users = [{
name: 'sameer',
age: 21
},
{
name: 'ganesh',
age: 22
}
]
$scope.setcontactModal = function(user) {
$scope.modalcontactData = user;
}
});
My first index page: 我的第一个索引页面：
<body ng-controller='myController'>
<table class="table">
<tr>
<th>Name</th>
<th>Age</th>
<th>Operations</th>
</tr>
<tr ng-repeat='user in users'>
<td>{{user.name}}</td>
<td>{{user.age}}</td>
<td> <a href="edit.html" ng-click='setcontactModal(user)'> Apply </a> </td>
</tr>
</table>
</body>
I want to share this $scope.modalcontactData into another file called edit.html file: 我想将此$ scope.modalcontactData共享到另一个名为edit.html文件的文件中：
This is my another html file called edit.html 这是我另一个名为edit.html的 html文件。
<body ng-controller='myController'>
<p>hello {{modalcontactData}} </p>
</body>
I tried this: 我尝试了这个：
angular
.module('myApp', ['ngStorage'])
.controller('myController', function($scope, $rootScope,$localStorage) {
$scope.users = [{
name: 'sameer',
age: 21
}, {
name: 'ganesh',
age: 22
}]
$localStorage.modalcontactData = $scope.modalcontactData;
$scope.setcontactModal = function(user) {
$scope.modalcontactData = user;
console.log('scope:', $scope.modalcontactData);
}
});
2 个解决方案
解决方案1
1 已采纳 2018-01-03 04:38:25
In your case, you can use local storage like this. 就您而言，您可以像这样使用本地存储。
working demo: https://plnkr.co/edit/84V6v7qkeE62hI1eU0eu 工作演示： https : //plnkr.co/edit/84V6v7qkeE62hI1eU0eu
angular .module('myApp', ['ngStorage']) .controller('myController', function($scope, $rootScope) { $scope.modalcontactData=JSON.parse(window.localStorage.getItem("user")) $scope.users = [{ name: 'sameer', age: 21 }, { name: 'ganesh', age: 22 }] $scope.setcontactModal = function(user) { $scope.modalcontactData = user; window.localStorage.setItem("user",JSON.stringify(user)); console.log('scope:', $scope.modalcontactData); } });
解决方案2
1 2018-01-03 06:04:30
If you want to store the data in local storage you can use local forage its a very helpful library for storing and retrieving data in json format. 如果要将数据存储在本地存储中，则可以使用本地草料库，这是一个非常有用的库，用于以json格式存储和检索数据。
Just add this file to your index.html https://github.com/localForage/localForage/blob/master/dist/localforage.js 只需将此文件添加到您的index.html https://github.com/localForage/localForage/blob/master/dist/localforage.js
<script src="js/localforage.js"></script>
And now you can easily store or retrieve data from local storage in json format using these simple functions.To save the data you can use- 现在您可以使用这些简单的功能轻松地以json格式存储或从本地存储中检索数据。要保存数据，您可以使用-
localforage.setItem("modelContactData", user);
And to retrieve the data use- 并检索数据使用-
localforage.getItem("modelContactData",function(err,data){
console.log(data);
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.