不为动态搜索结果显示angularjs分页

时间:2016-01-04 09:30:05

标签: javascript .net angularjs twitter-bootstrap user-interface

分页不会显示如下。

显示结果计数的数量应为25.然后页面计数器应显示类似于

的内容

1 2 3 4 5 .... 20下一步

应显示每页5条记录。请帮助解决这个问题我尝试了不同的方法,但仍无法找到解决方案。



 dataservice.getData().then(function (dataResponse) {
        //debugger;
        // $scope.venues = dataResponse.data.ListingGuid;
        venueListSort = dataResponse.data.UserListings;
        //$(".se-pre-con").fadeOut("slow");            
        $scope.venues = dataResponse.data.UserListings;
        $scope.viewby = 2;
        $scope.totalItems = dataResponse.data.UserListings.length;
        $scope.currentPage = 1;
        $scope.itemsPerPage = 5;
        $scope.maxSize = 5; //Number of pager buttons to show

        $scope.setPage = function (pageNo) {
            $scope.currentPage = pageNo;
        };

        $scope.pageChanged = function () {
            console.log('Page changed to: ' + $scope.currentPage);
        };

        $scope.setItemsPerPage = function (num) {
            $scope.itemsPerPage = num;
            $scope.currentPage = 1; //reset to first paghe
        };
        if ($scope.venues.length == 0) {
            //$("#NotFound").show();
            $("#NotFound").css("display", "block");

        }
        else {
            $("#NotFound").css("display", "none");
        }
       

<!-- begin snippet: js hide: false -->
&#13;
hear is my view in cshtml page 
<body ng-controller="VenueCtrl" ng-app="DemoApp" id="AppHere">
<div class="list-item row" ng-repeat="venue in venues.slice(((currentPage-1)*itemsPerPage), ((currentPage)*itemsPerPage)) | dynamicFilter:Filters:this">
                    <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 margin-padding-none">
                        <div class="carousel-demo" style="width:100%">
                            <ul rn-carousel rn-carousel-controls rn-carousel-index="carouselIndex" rn-carousel-buffered class="carousel1" ng-mouseover="changecolor($index)">
                                <li ng-repeat="slide in venue.listImageGallery track by $index" ng-class="'id-' + ($index+1)">

                                    <div ng-style="{'background-image': 'url(' + slide.ImageURL + ')'}" class="bgimage">
                                    </div>
                                </li>

                            </ul>
                        </div>
                    </div>
  </div>

<div>
                    <pagination total-items="totalItems" ng-model="currentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></pagination>
                    <pre>Page: {{currentPage}} / {{numPages}}</pre>
                </div>
</body>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

<pagination total-items="totalItems" ng-model="currentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false"num-pages="numPages" items-per-page="itemsPerPage"></pagination>
                <pre>Page: {{currentPage}} / {{numPages}}</pre>
            </div>

将分页指令.js及其依赖项添加到主角度模块