AngularJS: бесконечная прокрутка с <таблицей>

У меня есть бесконечная прокрутка, работающая с одним набором данных должным образом. Когда я выполняю аналогичную задачу (индекс изображения) с использованием таблицы HTML, функция loadMore() вызывается слишком часто. Обычно одна легкая прокрутка будет проходить через весь набор данных. Google не привел мне конкретного примера использования таблицы, так что мне интересно, если я что-то напутал.

    <table>
        <span infinite-scroll="loadMore()" infinite-scroll-distance='2' infinite-scroll-disabled="load_disabled">
        <tr data-ng-repeat="row in data">
            <td data-ng-repeat="item in row">
                <div class="image_box">
                    <img data-ng-src="{{item.thumb_src}}"><br>{{item.title_eng}}
                </div>
            </td>
        </tr>
        </span>
    </table>

Javascript. Обратите внимание, что $scope.data - это массив массивов моих элементов. $scope.data[0] будет содержать 5 элементов, которые содержат миниатюру и немного текста.

angular.module('myApp', ['ngRoute','infinite-scroll'])
.controller("imageController",
        ['$scope',
        '$http',
        '$routeParams',
        '$rootElement',
        '$location',
        function($scope,$http,$routeParams,$rootElement,$location) {


$scope.data = new Array();
row = -1;

for ( var i = 0; i < 100; i++ ) {

    if ( i % 5 == 0  ) {
        row++;
        $scope.data[row] = new Array();
    }

    var item = [];
    item["title_eng"] = "title " + i;
    $scope.data[row].push( item );
}

console.log( "We got " + row + 1 + " rows." );

$scope.rows = new Array();
var row_ix = 0;

$scope.loadMore = function() {

    if ( !$scope.data[row_ix] || !$scope.data[row_ix].length ) {
        return;
    }

    var x = 1; // 1 at a time
    console.log( "row_ix:  " + row_ix + "." );
    for ( var i = 0; i < x; i++ ) {
        $scope.rows[row_ix] = new Array();
        $scope.rows[row_ix] = $scope.data[row_ix].slice(0);
        row_ix++;
    }
}

angular.module('infinite-scroll').value('THROTTLE_MILLISECONDS', 250);\

РЕДАКТИРОВАТЬ: Возвращаясь к этому через некоторое время. Дроссель, кажется, не работает.:(

0 ответов

Другие вопросы по тегам