如何使用 angularjs 在本地存储中保存 json 响应？答案

【问题标题】：How to save json response in local storage using angularjs?如何使用 angularjs 在本地存储中保存 json 响应？
【发布时间】：2014-08-20 06:17:35
【问题描述】：

我有返回 json 响应的 api，我想将该 json 响应存储在 localstorage 中，以便使用 angularjs 在我的另一个 html 页面中使用该响应。

这是我返回 json 响应的代码......

QAApp.controller('SearchCtrl', function ($scope, $http, $location) {

  $scope.search = function (searchtag) {
           var request = $http({
                          method: 'GET', 
                          url: server + 'api/question/tagged/' + searchtag,
                        });
                request.success(function(data, status, headers, config) {
                console.log(data);
                $scope.qa = data;
            });

        }
  });

请告诉我如何存储它...

【问题讨论】：

标签： json angularjs

【解决方案1】：

在你的 request.success() 上，使用

window.localStorage['storageName'] = angular.toJson(data);

然后就可以通过

访问localstorage中的数据了

var accessData = window.localStorage['storageName'];

【讨论】：

是的，它正在工作，我可以保存在本地存储中。你能告诉我如何在html页面中使用“storageName”来使用angularjs显示数据。
@AnitaMehta var accessData = window.localStorage['storageName']; $scope.VarName = angular.fromJson(accessData);因此您可以使用“varname”自定义 HTML 页面中的数据
我得到了响应，但我无法显示.....我正在做的是 onclick 我得到了响应并想显示到下一页.....所以在 onclcik 之后我得到了数据，还转到下一页数据未显示....
var accessData = window.localStorage['storageName']; $scope.VarName = angular.fromJson(accessData);在 HTML 页面中使用 {{VarName.}}
使用像 {{}} 这样的双花括号，在 HTML 页面中显示数据

【解决方案2】：

我想推荐这个，因为我用过它并且它工作稳定https://github.com/gsklee/ngStorage。

下载并附加到您的项目后，您应该将其添加为依赖项

    QAApp.controller('SearchCtrl', function ($scope, $http, $location,$localStorage) {

      $scope.search = function (searchtag) {
               var request = $http({
                              method: 'GET', 
                              url: server + 'api/question/tagged/' + searchtag,
                            });
                    request.success(function(data, status, headers, config) {
                    $localStorage.qa = datal
                    $scope.qa = data;
                });



  }
  });

【讨论】：

【解决方案3】：

$scope.Save = angular.toJson(data); //Save to storage
sessionStorage.setItem('blablabla',$scope.Save);
localStorage.setItem('blablabla', $scope.Save); 

$scope.DataFromJson = JSON.parse(sessionStorage["blablabla"]); //Get from storage
$scope.DataFromJson = JSON.parse(localStorage["blablabla"]);

【讨论】：

【解决方案4】：

我建议使用 GitHub 上的 angular-local-storage 模块。

【讨论】：

【解决方案5】：

/* 从 localStorage 中获取 json */

var user = angular.fromJson($window.localStorage['md-user']);

/* 将 json 存储到 loacalStorage */

$window.localStorage['md-user'] = angular.toJson(user);

【讨论】：

【解决方案6】：

存储

$scope.storeItem = function() {
 sessionStorage.setItem('item', angular.toJson($scope.selectedItem));
}

检索

$scope.retrieve = function() {
    $scope.selectedItem = JSON.parse(sessionStorage.getItem('item'));
}

【讨论】：