如何将搜索页面的搜索结果放入下一页并显示答案

【问题标题】：How do i get the search results of a search page into the next page and display如何将搜索页面的搜索结果放入下一页并显示
【发布时间】：2016-08-24 19:39:57
【问题描述】：

在这个离子应用程序中，我想从搜索页面输入数据并在下一页显示结果。但是当我尝试它时它不会工作。我可以将搜索结果发送到控制台。即使我为两个页面制作相同的控制器，数据也不会传递到下一页。请帮我解决这个问题！！谢谢！！

这是我的按钮代码（'searchA' 是包含输入数据的对象）

<button type="button"  class="button button-block button-positive" ng-click="search(searchA)" ui-sref="app.MainSearchResult">Search</button>

这些是我的状态（app.js 文件）

    .state('app.MainSearch', {
      cache:false, 
      url: '/MainSearch',
      views: {
        'menuContent': {
          templateUrl: 'templates/MainSearch.html',
          controller: 'MainSearchCtrl'
        }
      }
    })

    .state('app.MainSearchResult', {
  url: '/MainSearchResult,
  views: {
    'menuContent': {
      templateUrl: 'templates/MainSearchResult.html',
      controller: 'MainSearchResultCtrl'
    }
  }
})

这是我的搜索功能（controller.js）

  $scope.search = function(searchA){

    console.log('No : '+ searchA.emp_EPF);
    console.log('Name : '+ searchA.emp_Name);
    console.log('Company :'+ searchA.emp_Comp);
    //console.log('qualification Type : ' + emp_qualiType);
    console.log('-------------------');

    $http({
      method: 'GET',
      url: 'http://localhost/mas/Search.php',
      params: {employeeNo : searchA.emp_EPF,
        employeeName : searchA.emp_Name,
        employeeCompany : searchA.emp_Comp,
        employeeBusinessUnit : searchA.emp_BU,
        employeeTeamName : searchA.emp_Team,
        employeeSecondaryCompany : searchA.emp_secondmant,
        employeeRelatedEmployee : searchA.emp_relatedEmp,
        employeeWorkLevel : searchA.emp_workl,
        employeeDesignationName : searchA.emp_designation,
        qualificationType : searchA.emp_qualiType,
        qualificationField : searchA.emp_qualiField,
        programName : searchA.emp_progName,
        serviceProvider : searchA.emp_svcProvider
      }
    }).then(function successCallback(response) {
      $scope.searchResults  = response.data['records'];
      console.log('success :'+ JSON.stringify($scope.searchResults));      

    }, function errorCallback(response) {
      console.log('error',response);
      // called asynchronously if an error occurs
      // or server returns response with an error status.
    });

    angular.copy($scope.resetData,searchA);

  }

这是我的下一页结果集视图。

  <ion-list ng-repeat="x in searchResults">
    <ion-item class="item item-text-wrap"  >
      <div >
        <h2>{{x.employeeNo}}</h2>
        <p>{{x.employeeName}}</p>
          <div>
            <a class="button button-outline button-medium button-positive" >Edit</a>
          </div>
      </div>
    </ion-item>
  </ion-list>

请帮我完成这个！谢谢！！

【问题讨论】：

您有哪些无法解决的问题？控制台输出是什么？
当我将结果带到同一页面（搜索页面）的控制台时，它应该显示为 JSON 对象。我无法将搜索查询的结果集带到下一页（搜索结果页面）！我需要知道如何将这些结果带到下一页（搜索结果页面）

标签： javascript html angularjs ionic-framework

【解决方案1】：

一个简单的解决方案是让工厂返回一个对象，并让两个页面上的控制器使用对同一对象的引用

var myApp = angular.module('myApp', []);
myApp.factory('Data', function(){
    //Make your search request here.
    return Data;
});
myApp.controller('MainSearchCtrl', function( $scope, Data ){
    $scope.searchResults  = Data;
});
myApp.controller('MainSearchResultCtrl', function( $scope, Data ){
    $scope.searchResults  = Data;
});

在视图/范围/控制器之间共享数据的最简单方法，最简单的方法是将其存储在$rootScope。

在 MainSearchCtrl 中，

 $scope.searchResults  = response.data['records'];
 $rootscope.searchResults  = $scope.searchResults;

您也可以在 SearchResults 页面上使用相同的变量。

【讨论】：