Question

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

现在我要做的就是在点击一个新的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>

Answer 1

在这里你有两个不同的页面，每当你从一个页面移动到另一个页面（没有SPA）时，页面将完成刷新....所以如果有人想在全局变量，服务甚至$ rootScope中这将无法正常工作，因为这些变量将被刷新。

为了应对，我们需要使用cookies，querystring或浏览器localStorage。

要在Angularjs中使用本地存储，您需要在angular-local-storage Github Link

的两个页面中都包含一个脚本

代码示例如何使用它：

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');
}]);

图书馆主要功能：

.set：在localStorage空间中设置键值
.clearAll：清除localStorage中的所有键
.delete：删除密钥
.get：从localStorage获取密钥

Working Fiddle

参考local Storage实际上是什么

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

1 个答案: