AngularJS localStorage JSON

Uloženie údajov do localStorage.

Uloženie údajov do localStorage. Údaje sa ukladajú vo formáte JSON. Po návrate na túto stránku možno údaje obnoviť.
Key: {{key}}
src: {{src|json}}
Storage: {{storage_copy|json}}

script

<script src=https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.min.js></script>

localstoragejson.html

<div ng-app="myApp" ng-controller="myCtrl">
    <form class="form-horizontal">
    <div class="form-group">
        <label class="control-label col-sm-4" for="key">Key:</label>
        <div class="col-sm-8">
        <input class="form-control" type="text" ng-model="key" placeholder="Vložte kľúč" id="key">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-4" for="x">src.x:</label>
        <div class="col-sm-8">
        <input class="form-control" type="text" ng-model="src.x" placeholder="Vložte hodnotu" id="x">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-4" for="y">src.y:</label>
        <div class="col-sm-8">
        <input class="form-control" type="text" ng-model="src.y" placeholder="Vložte hodnotu" id="y">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-offset-4 col-sm-8">
        <button type="button" class="btn btn-default" ng-click="save()">Uložiť</button>
        <button type="button" class="btn btn-default" ng-click="load()">Načítať</button>
        <button type="button" class="btn btn-default" ng-click="delete()">Vymazať</button>
        </div>
    </div>
    </form>
    <hr>
    <pre>Key: {{key}}
src: {{src|json}}
Storage: {{storage_copy|json}}</pre>

</div>

localstoragejson.js

var app = angular.module('myApp', []);

app.controller('myCtrl', ['$scope', '$window', function($scope, $window) {
    $scope.key = 'srckey1';
    $scope.src = {x: '1', y: '2'};
    $scope.storage_copy = $window.localStorage;

    $scope.save = function() {
        $window.localStorage.setItem($scope.key, JSON.stringify($scope.src));
        $scope.storage_copy = $window.localStorage;
    };

    $scope.load = function() {
        $scope.src = JSON.parse($window.localStorage.getItem($scope.key));
    };

    $scope.delete = function() {
        $window.localStorage.removeItem($scope.key);
        $scope.storage_copy = $window.localStorage;
    };

}]);

Aplikácie

Menu