JavaScript中的slice函数不用于分页

我正在用Angularjs做一个Todo应用程序。我尝试使用分页，每页只显示5个待办事项。我可以添加分页，但slice函数在todos列表上不起作用

它表示未定义的切片函数。我知道它行为不明的原因。这是因为todo列表不在范围内，我需要以某种方式将todo列表带出，以便下一个函数可以使用它。但如果没有成功，我可以让它成为可能

这是我的控制器代码：

todoApp.controller('mainController', ['$scope', '$filter', 'Todos', function($scope, $filter, Todos) {
    $scope.formData = {};
    $scope.loading = true;
    $scope.count = 0;

    $scope.filteredTodos = [];   
    $scope.currentPage = 1;
    $scope.numPerPage = 5;
    $scope.maxSize = 5;

    // GET =====================================================================
    // when landing on the page, get all todos and show them
    // use the service to get all the todos
    //$scope.todos = [];
    Todos.get()
        .success(function(data) {
            $scope.todos = data;
            // for(var i = 0; i < data.length; i++) {
                //$scope.todos.push(data[i]);
            //}
            $scope.loading = false;
            angular.forEach($scope.todos, function(todo){
                todo.formattedCreatedOn = $filter('date')(new Date(todo.createdOn),'MMM dd, yyyy  -  hh:mm a');
            });
        });

     $scope.$watch('currentPage + numPerPage', function() {
        var begin = (($scope.currentPage - 1) * $scope.numPerPage);
        var end = begin + $scope.numPerPage;

        $scope.filteredTodos = $scope.todos.slice(begin, end);
    });
}]);

todoApp.controller（'mainController'，['$scope'，'$filter'，'Todos'，函数（$scope，$filter，Todos）{
$scope.formData={}；
$scope.loading=true；
$scope.count=0；
$scope.filteredTodos=[]；
$scope.currentPage=1；
$scope.numPerPage=5；
$scope.maxSize=5；
//得到=====================================================================
//登录页面时，获取所有待办事项并显示它们
//使用该服务获取所有待办事项
//$scope.todos=[]；
Todos.get（）
.成功（功能（数据）{
$scope.todos=数据；
//对于（变量i=0；i

$scope.todos，我需要以某种方式将其置于当前范围之外。因此它不适用于

函数$scope.todos.slice（begin，end）

另一件事是在构建todos列表之前调用$watch函数。这是因为当服务从db检索TODO时，$watch已经在长度为0的列表上被调用，因此无法进一步工作

---

我甚至尝试在中使用代码。

我认为应该首先定义$scope.todos（有注释行，为什么注释掉了？），然后检查边界“begin”和“end”是否在todos数组的大小范围内。您可能会收到许多不能被numPerPage分割的元素，因此在任何情况下，您都必须检查end是否超出了数组的大小，如果超出了，则进行相应的设置

$scope.$watch('currentPage + numPerPage', function() {
    var begin = (($scope.currentPage - 1) * $scope.numPerPage);
    var end = begin + $scope.numPerPage;

    if(end>=$scope.todos.length)
      end = $scope.todos.length-1;

    $scope.filteredTodos = $scope.todos.slice(begin, end);
});

让我知道这是否奏效

---

干杯，克里斯托夫

如果你显示一个待办事项列表，我想你的模板中有一个ng重复。您可能对Limito filter感兴趣，这是出于显示目的过滤数据的一种更好的方法：

例如：

angular.module（'myApp'，[]）.controller（'TodosController'，
函数到控制器（$scope）{
$scope.todos=[
{name:“todo1”}，
{name:“todo2”}，
{name:“todo3”}，
{name:“todo4”}，
{name:“todo5”}，
{name:“todo6”}，
{name:“todo7”}
];
/*每页行数*/
$scope.limit=3；
/*我们从项目0开始显示*/
$scope.begin=0；
}
);

todos（第{begin/limit}}页）：

{{{todo}

上一页
下一页
我添加了以下代码：

todoApp.filter('limitFromTo', function(){
    return function(input, from, to){
        return (input != undefined)? input.slice(from, to) : '';
    }
});

在这里使用了这个过滤器：

ng-repeat="todo in todos | limitFromTo:(currentPage-1)*itemsPerPage:(currentPage*itemsPerPage)"

我没有使用limitTo函数，该函数使用的参数是
itemsPerPage
和
（currentPage-1）*itemsPerPage
，而是使用了limitFromTo，这是我自己的过滤器，它在数组中有两个偏移量，比如如果currentPage是1，那么它将显示0-5之间的记录，2 6-10等等。limitTo过滤器有一些参数，如要显示多少条记录和从哪个索引或偏移量，这不是我想要的，因此根据我的需要使用limitFromTo。它成功了
 尝试将
$scope.$watch
放在
内。成功
回调：

Todos.get()
    .success(function(data) {

        $scope.$watch('currentPage + numPerPage', function() {
          var begin = (($scope.currentPage - 1) * $scope.numPerPage);
          var end = begin + $scope.numPerPage;

          $scope.filteredTodos = data.slice(begin, end);
        });
    });
});

你为什么要看这些变量？我不明白。只要添加一个普通的scope方法，单击paginator指令就会调用它。我这样做了，正如我刚才附加的plunker链接所示。但这并不成功。请多帮我一点好吧，发生什么事了？它还抱怨$scope.todos在$scope.watch中未定义吗？不，它没有抱怨我。但它根本不显示任何记录，只显示分页内容，如：First Previous 1 Next Last。就是这样。我想这是因为currentPage+numPerPage在检索数据后不会发生变化（这是异步的）。您是否尝试从ui更改这些参数？也许安装ng inspector for chrome来查看您的范围。在这里，它将超出我的任务范围，不是吗？就像你的案例本身一样，有7个ToDOS适合2个页面5。如果我尝试进入下一页，它将不会显示任何内容，对吗？？如果我错了，请纠正我。如果是这样的话，如何阻止它？我不确定我是否理解你的问题。这只是“limito”的一个演示，它是一个不完整的分页系统。我会编辑一下。无论如何，在使用Limito时，只需修改“begin”模型，您就可以启动自己的分页系统。但它只是在更改页码：
todos（第0页）
，而不是页面上显示的记录。也就是说，单击next和previous（下一页和上一页）时，只有页码在变化，列表中的记录没有变化。这在我这方面对Chrome 45.0.2454.101或FF42很有效：如果我单击“next page（下一页）”，我会得到以下信息：
todos（第1页）：{“name”：“todo4”}{“name”：“todo5”}{“name”：“todo6”}
我已编辑了示例，因此您无法转到显示s的“底片”页面