Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/24.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 为AngularJS博客分页_Javascript_Angularjs_Express_Pagination_Mean Stack - Fatal编程技术网

Javascript 为AngularJS博客分页

Javascript 为AngularJS博客分页,javascript,angularjs,express,pagination,mean-stack,Javascript,Angularjs,Express,Pagination,Mean Stack,我正在尝试使用AngularJS和平均堆栈对我的blogroll进行分页。我已经设置了我的文章(博客文章)控制器,并且我已经设置了list.html来显示所有内容。我可以让所有的博客都显示出来,也可以让分页递增,但我不能让blogroll一次显示5个项目,并随着分页递增 angular.module('mean.articles') .controller('ArticlesController', ['$scope', '$routeParams', '$location', 'Global'

我正在尝试使用AngularJS和平均堆栈对我的blogroll进行分页。我已经设置了我的文章(博客文章)控制器,并且我已经设置了list.html来显示所有内容。我可以让所有的博客都显示出来,也可以让分页递增,但我不能让blogroll一次显示5个项目,并随着分页递增

angular.module('mean.articles')
.controller('ArticlesController', ['$scope', '$routeParams', '$location', 'Global', 'Articles', function ($scope, $routeParams, $location, Global, Articles) {
    $scope.global = Global;        
    $scope.currentPage = 0;
    $scope.pageSize = 5;

     //I've my create, update and delete methods here.

    $scope.find = function() {
        Articles.query(function(articles) {
            $scope.articles = articles;
        });
    };

    $scope.numPages = function() {
        return Math.ceil($scope.Articles.length / $scope.pageSize);
    };
下面是我的list.html:

<div class="container" style="width:900px; margin:auto">

<div class="container" style="width:600px; float:left">

        <section data-ng-controller="ArticlesController" data-ng-init="find()"> 
            <ul class="articles unstyled" style="width:600px">
                <li data-ng-repeat="article in articles | filter:search | limitTo:pageSize">
                    <h2><a data-ng-href="#!/articles/{{article._id}}">{{article.title}}</a></h2>
                    <div>{{article.content}}</div>
                    <div>{{article.tags}}</div>
                    <h4><small>
                        <div class="well well-small text-center" style="width:300px">
                            <div style="margin:auto">
                                <span>{{article.created | date:'medium'}}</span> /
                                <span>{{article.user.name}}</span>
                            </div>
                        </div>
                    </small></h6>
                </li>
            </ul>
            <h1 data-ng-hide="!articles || articles.length">No articles yet. <br> Why don't you <a href="/#!/articles/create">Create One</a>?</h1>

            <button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1">
                Previous
            </button>
                {{currentPage+1}}/{{numPages()}}
            <button ng-disabled="currentPage >= numPages()-1" ng-click="currentPage=currentPage+1">
                Next
            </button>
        </section>      
</div>

<div class="container" style="width:300px; float:left">
    <input type="text" ng-model="search" placeholder="Enter your search terms" />
</div>

  • {{article.content} {{article.tags} {{article.created}日期:'medium'}/ {{article.user.name}
还没有文章<你为什么不呢? 以前的 {{currentPage+1}}/{{numPages()} 下一个

来自。看起来您缺少的主要内容是指示从何处开始您的
ng repeat
。我链接到的小提琴通过创建一个
startFrom
过滤器来解决它