单击“搜索”按钮，在下一页显示结果

Question

我搜索了解决方案但找不到这里发布的确切解决方案。 我在标题菜单中有一个搜索栏。当在搜索按钮上键入并单击搜索内容时，结果需要显示在新页面中（例如，result.html）。 API用于获取搜索结果。

我在下面添加了js伪代码，这将解释我打算做什么。

感谢您的建议。

导航

<nav class="navbar navbar-default navbar-fixed-top navbar-search-box animate" role="navigation">
    <div class="row">
        <div class="collapse navbar-collapse" >
            <ul class="nav navbar-nav" id="main-nav">
                <li> ... </li>
                <li>
                    <div class="search-bar-search animate">
                        <div class="container" ng-controller="searchCtrl">
                            <div class="input-group">
                                <input type="text" class="form-control" id="q" ng-model="q" placeholder="Search for...">
                                <span class="input-group-btn">
                                <button class="btn btn-primary" type="button" ng-click="search()">Search</button>
                                </span>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</nav>

Search.js

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

app.service('searchService', function($http) {
    this.getResult = function(q) {
        // o/p is in JSON format
        return $http.get('http://mydomainname/api/search/'+q);
    }
});
app.controller('searchCtrl', function ($scope, searchService){
    $scope.search = function (){
        var q = $scope.q;

        searchService.getResult(q).then(function (response){
                $scope.result = response.data;
                // redirect to new template (result.html) and display result
                ...
                ...
            });

    };
});