Question

我有一个允许用户执行搜索的Ionic应用程序，我将搜索结果保存到服务中，如果再次访问该页面，并且在将用户重定向到之前服务中有结果用户可以单击以清除结果以重新开始搜索的结果页面。

我当前的代码显示了结果页面上的数据，但是当点击重置点击它没有做任何事情时，我将结果直接从我的API传递到$状态，所以我绕过了服务但是除了传递到$ state之外，我还将数据保存到服务中。

伪代码***

我注入的控制器依赖

.controller('SearchCtrl', function($scope, $http, $state, $ionicLoading, $ionicHistory, serviceName) {

if(serviceName.searchHistory){
      $state.go('app.searchResults', {items: {items: serviceName.getSearch}});
    } else {

$scope.beginSearch = function() {
          $http.post('https://domain/api/v1/search?token=' + localStorage.getItem("token"),$scope.search).then(function(successResponse){

            $scope.return = successResponse;
            $scope.searchResponse = $scope.return.data.data[0];

            serviceName.setSearch($scope.searchResponse.items);

            $state.go('app.searchResults', {items: {items: $scope.searchResponse.items}});

          });
      }
}
})

我的服务

angular.module('starter.services', [])

.factory('serviceName', function() {

    var searchHistory = [];

    return {

    getSearch: function(){
        return searchHistory;  
    },
    setSearch: function(data){
        var searchHistory = data;  
    },
    clearSearch: function(){
        searchHistory = [];
    }

    }

})

我的结果控制器

.controller('resultsCtrl', function($scope, $http, $state, $ionicLoading, $stateParams, $ionicPopup, serviceName) {

  $scope.item = $stateParams.items.items;
  $scope.data = {};

  $scope.resetFilter = function(){

    serviceName.clearSearch();
    $state.go('app.beginSearch');

  }

})

Answer 1

您不应将数组用作$ stateParameters，它们的工作方式类似于查询字符串参数。

您希望实现的目标可能是另一种选择：

将用户重定向到'app.searchResults'状态。

.controller('SearchCtrl', function($scope, $http, $state, $ionicLoading, $ionicHistory, serviceName) {

if(serviceName.searchHistory){
      $state.go('app.searchResults');
    } else {

$scope.beginSearch = function() {
          $http.post('https://domain/api/v1/search?token=' + localStorage.getItem("token"),$scope.search).then(function(successResponse){

            $scope.return = successResponse;
            $scope.searchResponse = $scope.return.data.data[0];

            serviceName.setSearch($scope.searchResponse.items);

            $state.go('app.searchResults', {items: {items: $scope.searchResponse.items}});

          });
      }
}
})

在其控制器中，加载自定义服务的结果。

.controller('resultsCtrl', function($scope, $http, $state, $ionicLoading, $stateParams, $ionicPopup, serviceName) {

      $scope.item = serviceName.getSearch();
      $scope.data = {};

      $scope.resetFilter = function(){

        serviceName.clearSearch();
        $state.go('app.beginSearch');

      }

    })

更新：

在您的服务中，您在更新方法中使用var，这意味着您正在创建searchHistory的新引用。您应该删除var以保留引用。

angular.module('starter.services', [])

.factory('serviceName', function() {

    var searchHistory = [];

    return {

    getSearch: function(){
        return searchHistory;  
    },
    setSearch: function(data){
        searchHistory = data;  
    },
    clearSearch: function(){
        searchHistory = [];
    }

    }

})

离子传递阵列服务

1 个答案: