Hi i am new to angular js and i am working around anglarjs local storage technique so that data persist on refresh. Is there any way i can delete the local storage all in one and Also assign the scope storage to a model and use the model in html than $storage.id. I m very new and please share and help me. Thank
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>
</title>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="angular-local-storage.js"></script>
<script type="text/javascript" src="angular-route.js"> </script>
<script>
var myApp=angular.module("myApp",['ngStorage','ngRoute']);
myApp.controller('myAppCtrl', ['$scope','$localStorage','$location', function($scope,$localStorage,$location){
$scope.$storage=$localStorage.$default({
myname:"",
myid:"",
mynumber:"",
});
$scope.add=function()
{
alert("asdsd")
delete $scope.$storage.myid;
delete $scope.$storage.myname;
delete $scope.$storage.mynumber;
$location.path("/add");
} }]);
myApp.config(['$routeProvider','$locationProvider',function($routeProvider,$locationProvider) {
$routeProvider.
when('/', {
templateUrl: 'search.html',
controller:'myAppCtrl'
}).
when('/add',{
templateUrl:'add.html',
controller:'myAppCtrl'
}).
otherwise({
redirectTo: '/'
});
}]);
</script>
</head>
<body >
<div ng-view>
and my template is given below.
<script type="text/ng-template" id="search.html">
<button ng-click="add();"> add </button>
</script>
<script type="text/ng-template" id="add.html">
<div>
<input type="text" ng-model="$storage.myname"/></br>
<input type="text" ng-model="$storage.myid"/></br>
<input type="number" ng-model="$storage.mynumber"/></br>
<button ng-click="submit();"> submit </button>
<button ng-click="edit();"> view button </button>
</div>
</script>
</body>
</html>
To delete local storage sessions, use the removeItem() method. When passed a key name, the removeItem() method removes that key from the storage if it exists. If there is no item associated with the given key, this method will do nothing.
The only thing you can do is set the delete statement in a timeout of 1 hour. This requires the user to stay on your page or the timeout won't be executed. You can also set an expiration field. When the user revisits your site, check the expiration and delete the storage on next visit as the first thing you do.
Local Storage data will not get cleared even if you close the browser. Because it's stored on your browser cache in your machine. Local Storage data will only be cleared when you clear the browser cache using Control + Shift + Delete or Command + Shift + Delete (Mac)
The clear() method of the Storage interface clears all keys stored in a given Storage object.
you can use $localStorage.$reset();
it will delete all your data from localStorage
To delete local storage all in one , use $localStorage.clearAll().
To manually add a key / value pair to local storage, use $localStorage.add('id', $scope.id). Or, to bind to a scope variable directly, use $localStorage.bind($scope, 'id', id).
To get the value from local storage, use $localStorage.get('id').
The documentation on the GitHub ReadMe explains this: https://github.com/grevory/angular-local-storage
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With