我如何得到一个搜索页面的搜索结果进入下一页和显示

How do i get the search results of a search page into the next page and display

本文关键字：搜索结果 显示 一页 搜索 何得 一个      更新时间：2023-09-26

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

这是我的按钮代码('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>

请帮我把这个做完!!谢谢! !

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

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页面上使用相同的变量

相关文章：