Question

我在我的应用程序中使用此指令http://jsfiddle.net/q62jx3s6/这是angularjs with ionic，我的问题是当我尝试在此指令中使用无限滚动时仅在我滚动时加载更多数据：

首先，我将展示我的代码并解决问题。

fancy-select-items.html我放在这里：

        <label class="item item-input">
            <i class="icon ion-search placeholder-icon"></i>
            <input type="search" ng-model="search" placeholder="Buscar ...">
        </label>
        <!-- Multi select -->
        <ion-toggle
                    ng-repeat="item in items | filter:search"
                    ng-if="multiSelect"
                    ng-checked="item.checked"
                    ng-model="item.checked"
                    class="item item-text-wrap">
            {{item.text}}
        </ion-toggle>

        <!-- Single select -->
        <ion-item
               ng-repeat="item in items | filter:search"
               ng-if="!multiSelect"
               class="item item-text-wrap"
               ng-click='validateSingle(item)'>
            {{item.text}}
        </ion-item>
    </ion-list>

    <ion-infinite-scroll spinner on-infinite="loadMore()" distance="10%">

    </ion-infinite-scroll>
</ion-content>

并且在花式选择的指令中我把它：

  scope.loadMore = function() {
      $timeout(function() {
          scope.items.push({
              id: "1",
              text: "teste"
          });
          console.log('inseriu');
          $scope.$broadcast('scroll.infiniteScrollReady');
          $scope.$broadcast('scroll.infiniteScrollComplete');
          $scope.$broadcast('scroll.resize');

      }, 500);
  }

在我的表单模板中我把它放在：

    <fancy-select
                  header-text="Parcero"
                  allow-empty='false'
                  value="formData.parcero"
                  text="elparcero"
                  items="parceros"   
                  ng-change="change()"
                  ng-model="formData.parcero">
    </fancy-select>

控制器：

$scope.parceros = [];

var query = "SELECT * FROM cadc001 WHERE cd_empresa =" + sessao.getData("sess_empresa") + " LIMIT 1, 30";
$cordovaSQLite.execute(db, query, []).then(function(res) {
       if (res.rows.length > 0) {
           for (var i = 0; i < res.rows.length; i++) {
               $scope.parceros.push({
                   id: res.rows.item(i).id,
                   text: unescape(res.rows.item(i).nome),
                   checked: false,
                   icon: null
               });
           }
       }
}, function(err) {
       console.error(err);
});

$scope.elparcero = 'Selecione un Parcero';

当我尝试打开应用程序时，我点击选择他打开模态，然后我滚动到底部他开始添加许多项目而不是停止，继续添加循环。当我滚动时，他只需要添加1个项目，每次只能添加1个项目。

在我的日志中

   ....
6     655085   log      inseriu
7     655621   log      inseriu
8     656220   log      inseriu
9     656826   log      inseriu
10    657357   log      inseriu
11    657897   log      inseriu
12    658433   log      inseriu
13    658965   log      inseriu
14    659505   log      inseriu
15    660041   log      inseriu
16    660577   log      inseriu
17    680685   log      inseriu
18    680697   log      inseriu
......

必须像这样工作，滚动到底部时每次一个：

http://codepen.io/elm/pen/Becqp

请帮助我，我的英语不是很好，抱错了。

Answer 1

尝试移动$apply

中的代码

    $timeout(function() {

     $scope.$apply(function(){   
       scope.items.push({
         id: "1",
         text: "teste"
       });
       console.log('inseriu');
       $scope.$broadcast('scroll.infiniteScrollReady');
       $scope.$broadcast('scroll.infiniteScrollComplete');
       $scope.$broadcast('scroll.resize');
    });

   }, 500);

需要帮助在angularjs + ionic中选择无限滚动

1 个答案: