如何使用angularJs将json响应从一个html页面传递到另一个html页面？

debugcn 发表于 Dev

安妮塔·梅塔（Anita Mehta）

我有用Laravel PHP编写的用于搜索功能的api 。当我在输入标签中键入一些字符串并单击搜索按钮时，我正在处理json响应。

现在，我要做的就是在ngClick上打开一个新的html页面，说“ search.html”，并使用angularjs显示json响应。

我做不到，可能是我的知识之湖：）。谁能告诉我该怎么做。

这是我的代码：

// Search Controller

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

  $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;
            });

        }

  });

html页面是：

<div class="collapse navbar-collapse navbar-ex1-collapse" ng-controller = "SearchCtrl">
                        <div style = "float: right; margin-top: 7px;" class="col-sm-3 col-md-3">
                            <form class="navbar-form" role="search">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Search...." name = "tag"  ng-model = "tag">
                                    <div class="input-group-btn">
                                        <button type="submit" class="btn btn-primary"  ng-click = "search(tag);">
                                            <span class="glyphicon glyphicon-search"></span>
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>

V31

在这里，您有两个不同的页面，每当您从一页移动到另一页（没有SPA）时，该页面都会完成刷新..因此，如果有人正在考虑将其包含在全局变量，服务甚至$ rootScope中，这些变量将得到刷新，因此可以正常工作。

为了解决这个问题，我们要么需要使用cookie，querystring要么是浏览器localStorage。

为了在Angularjs中使用本地存储，您需要在两个页面上都包含一个脚本，用于angular-local-storage Github链接

代码示例如何使用它：

angular.module('yourModule', ['LocalStorageModule'])
.controller('yourCtrl', [
  '$scope',
  'localStorageService',
  function($scope, localStorageService) {
    // Start fresh
    localStorageService.clearAll();

    // Set a key
    localStorageService.set('Favorite Sport','Ultimate Frisbee');

    // Delete a key
    localStorageService.delete('Favorite Sport');
}]);

/*
To set the prefix of your localStorage name, you can use the setPrefix method 
available on the localStorageServiceProvider
*/
angular.module('yourModule', ['LocalStorageModule'])
.config(['localStorageServiceProvider', function(localStorageServiceProvider){
  localStorageServiceProvider.setPrefix('newPrefix');
}]);