0

我正在努力在另一个开发人员的现有代码上实现分页。我已经尝试实现之前 SO 帖子中解释的一些解决方案：使用 ng-repeat 对列表进行分页

该代码采用二维数组，将其解析为字符串对象，然后将其显示在页面上。每个对象键用作一列。

不确定如何在此设置中使用Angular 的内置限制过滤器。我认为这将是理想的解决方案。但我也对 JS 解决方案持开放态度。（我已经开始将它作为一个 JS 解决方案放在帖子底部。）

var data = [["c1","blah","yup","halted","bacon", "blue"],
            ["c2","blank","everything","nothing test"],
            ["c3","test","vista","xp, 7 "],
            ["c4","true"],
            ["c5","do","something else really long text", "and more"]
        ]

$rootScope.resultsObject = parseResults(data);

var columnSize = ["twelve", "six", "four", "three", "two", "two"]

$rootScope.columnCountShow = columnSize[columnCounter($rootScope.resultsObject)-1]

factory('parseResults', function(){
        return function(resultsData){
            var resultsObject = {};
            var column;
            for(var i = 0; resultsData.length > i; i++){
                column = "column" +i;
                resultsObject[column] = resultsData[i].toString().replace(/[\,]/g, "<br>")
            }
            return resultsObject;
        }
    })

HTML：

<div class="{{columnCountShow}} columns results-column" ng-repeat="resultsObject in resultsObject">
        <div ng-bind-html-unsafe="resultsObject">
</div>

我将如何show more进行分页风格？它将遍历并显示每个数组的前 2 个结果，它们单击“显示更多”，然后加载下一个 2，依此类推。

我用来尝试执行此操作的当前方法：获取数据（在解析之前）并切掉一个部分，并仅解析该位。然后当他们选择show more时，它​​将占用接下来的几行等。

    var limit = 3;
    var start = 0;
    for (var i = 0; i < data.length; i++) {
        var ndata = [[]];
        ndata = data[i].slice(start,limit);
        console.log(ndata);
    }

与此问题，似乎data仍然完好无损。slice似乎并没有真正从数组中删除该部分？

更新

slice绝对不适合我。实现JS有splice方法。（出于某种原因，我认为它不存在。我目前拼接数据的方式是：

$scope.submitWords = function(){
        event.preventDefault();
        var columnCount = columnCounter($scope.keywords);
        var sendObject = keyWordSplit($scope.keywords, columnCount)

        var limit = 2;
        var start = 0;
        var ndata = [[]];
        for (var i = 0; i < $scope.testData.length; i++) {
            ndata[i] = $scope.testData[i].splice(start,limit);
            console.log(ndata);
            console.log("original data <br>" + $scope.testData);
        $rootScope.resultsObject = parseResults(ndata);
        }
        var columnSize = ["twelve", "six", "four", "three", "two", "two"];
        $rootScope.columnCountShow = columnSize[columnCounter($rootScope.resultsObject)-1];
    }

这正确地拆分了数据。现在我只需要让它更新我的模型。选择show_more()时，它会替换现有数据而不是附加到它。

4

0 回答 0