带有http.post结果的Ionic Infinite Scroll

时间:2015-10-21 17:23:17

标签: angularjs ionic

我正在尝试根据Gajotres帖子(http://www.gajotres.net/ionic-framework-tutorial-11-infinite-scroll/

创建无限滚动

我的问题是:

如果我写:$ scope.searchObjects($ scope.formData);所有$ scope对象都打印在屏幕上,如何避免?

我可以使用$ scope.formData传递表单数据,这样:。 $ scope.searchObjects($ scope.formData);

到目前为止,该列表冻结了7000个itens并且无法使无限滚动工作,似乎它加载所有的itens。

有一个更好的已知解决方案离子无限滚动与http.post?

以下是我的尝试代码,任何帮助都是apreciated:

.controller('someObjectsCtrl', function( $scope, $http) {
 $scope.data = null;
 $scope.itens = [];
  $scope.data = {
    'state'  : '',
    'city'  : '',
  }
  $http.get('http://someservice.com/states.php').then( function response(response){
        $scope.states = response.data;
    },function(error){
        $scope.error = JSON.stringfy(error);
  });

  $scope.getCities = function(id) {
    $http.get('http://someservice.com/state.php?stateid='+id).then( function response(result) {
          $scope.cities = result.data;
          $ionicLoading.hide();
      },function(error) {
          $scope.error = JSON.stringfy(error);
      });
    };
  $scope.originForm = angular.copy($scope.data);
  $scope.searchObjects = function(data) {
    $scope.formData = {};
    $scope.formData.state = data.state;
    $scope.formData.city  = data.city;
    $http.post("http://someservice.com/objectsToSearch.php", $scope.formData )
      .success( function(data) {

          $scope.result  = data;

          for (var i = 0; i <= 6; i++) {
            $scope.itens.push({ foundObjects: $scope.result.OBJECTS});
          }
          $scope.$broadcast('scroll.infiniteScrollComplete');

          if( $scope.result.length == 0 ){
            $scope.data = null;
          }
          $scope.headers = ['Some Objects', 'Another Objects' ];
     })
    .error(function(error){
      $ionicLoading.show({ template: '<p>Error ...</p>',duration :6000  });
    })
  }
  $scope.canWeLoadMoreContent = function() {
    return ($scope.itens.length > 10) ? false : true;
    console.log(' scope.itens.length '+$scope.itens.length );
  }
  $scope.searchObjects($scope.formData);
})

1 个答案:

答案 0 :(得分:0)

到目前为止,我找到的唯一解决方案是使用collectio-repeat而不是ng-repeat。 Collection-repeat非常快速地呈现结果列表。