Php 如何以角度显示12个结果中的1到10个

我想在表格底部以角度显示分页细节。 我尝试以下代码：

<table>
  <tr dir-paginate="reject in rejects|orderBy:sortKey:reverse|filter:search|itemsPerPage:itemsPerPage"
                                current-page="currentPage" style="border-bottom: solid 1px #ccc">
<td>@{{itemsPerPage *(currentPage-1)+$index+1}}</td>
<td><a ng-href="recorddetail/@{{reject.rec_id}}"
    style="text-decoration: none;">@{{reject.fullname}}</a></td>
                       <td>@{{reject.name}}</td>
                       <td>@{{reject.id}}</td>
                       <td>@{{reject.placeofb}}</td>
                       <td>@{{reject.dateofb}}</td>                          
                      </tr>

     </table>

    <div style="float: left">
      <span>Showing Result @{{itemsPerPage *(currentPage-1)+$index+1}} to  @{{     
      (itemsPerPage * currentPage) }} of  @{{rejects.length}}</span>     
    </div>
    <dir-pagination-controls
         page-size="1" direction-links="true"
             boundary-links="true" style="margin-top: 0; float: right;margin-bottom:
        10px;">
    </dir-pagination-controls>

@{{itemsPerPage*（当前页面-1）+$index+1}}
@{{reject.name}
@{{reject.id}
@{{reject.placeofb}}
@{{reject.dateofb}}
将结果{{itemsPerPage*（currentPage-1）+$index+1}}显示到{
{{rejects.length}

---

如何在页面中显示“72个结果中的1到10个”并在angular中搜索页面？

UI网格以前称为ng网格，它完全建立在angularjs库上，涵盖了所有核心网格功能，如排序、分页、过滤、导出等

你可以试试

---

这里有一个方法可以做到这一点。这对我来说很有效，我使用的是ng-grid-2.0.8.js

从服务器接收数据时-计算总共有多少页

$scope.totalPages = 0;
function getData() {
    ...
    $scope.totalPages = Math.ceil(data.length / pageSize);
    ...
};

然后确保显示页脚并使用自定义模板，如下所示：

$scope.gridOptions = {
    ...
    showFooter: true,
    footerTemplate: getCustomFooterTemplate(),
    ...
};

function getCustomFooterTemplate() {
        return "footerTemplate.html",
            '<div ng-show="showFooter" class="ngFooterPanel" ng-class="{\'ui-widget-content\': jqueryUITheme, ' +
            '\'ui-corner-bottom\': jqueryUITheme}" ng-style="footerStyle()">\n' +
            '   <div class="ngTotalSelectContainer" >\n' +
            '       <div class="ngFooterTotalItems" ng-class="{\'ngNoMultiSelect\': !multiSelect}" >\n' +
            '           <span class="ngLabel">{{i18n.ngTotalItemsLabel}} {{maxRows()}}</span>' +
            '           <span ng-show="filterText.length > 0" class="ngLabel">({{i18n.ngShowingItemsLabel}} ' +
            '           {{totalFilteredItemsLength()}})</span>\n' +
            '       </div>\n' +
            '       <div class="ngFooterSelectedItems" ng-show="multiSelect">\n' +
            '           <span class="ngLabel">{{i18n.ngSelectedItemsLabel}} {{selectedItems.length}}</span>\n' +
            '       </div>\n' +
            '   </div>\n' +
            '   <div class="ngPagerContainer" style="float: right; margin-top: 10px;" ng-show="enablePaging" ' +
            '   ng-class="{\'ngNoMultiSelect\': !multiSelect}">\n' +
            '       <div style="float:left; margin-right: 10px;" class="ngRowCountPicker">\n' +
            '           <span style="float: left; margin-top: 3px;" class="ngLabel">{{i18n.ngPageSizeLabel}}</span>\n' +
            '           <select style="float: left;height: 27px; width: 100px" ng-model="pagingOptions.pageSize" >\n' +
            '               <option ng-repeat="size in pagingOptions.pageSizes">{{size}}</option>\n' +
            '           </select>\n' +
            '       </div>\n' +
            '       <div style="float:left; margin-right: 10px; line-height:25px;" class="ngPagerControl" ' +
            '       style="float: left; min-width: 135px;">\n' +
            '           <button type="button" class="ngPagerButton" ng-click="pageToFirst()" ' +
            '           ng-disabled="cantPageBackward()" title="{{i18n.ngPagerFirstTitle}}">' +
            '           <div class="ngPagerFirstTriangle"><div class="ngPagerFirstBar"></div></div></button>\n' +

            '           <button type="button" class="ngPagerButton" ng-click="pageBackward()" ' +
            '           ng-disabled="cantPageBackward()" title="{{i18n.ngPagerPrevTitle}}"><div ' +
            '           class="ngPagerFirstTriangle ngPagerPrevTriangle"></div></button>\n' +

            '           <label style="vertical-align: top; font-weight: inherit;">{{pagingOptions.currentPage}} to {{totalPages}} of {{maxRows()}}</label>\n' +

            '           <button type="button" class="ngPagerButton" ng-click="pageForward()" ' +
            '           ng-disabled="cantPageForward()" title="{{i18n.ngPagerNextTitle}}"><div ' +
            '           class="ngPagerLastTriangle ngPagerNextTriangle"></div></button>\n' +

            '           <button type="button" class="ngPagerButton" ng-click="pageToLast()" ' +
            '           ng-disabled="cantPageToLast()" title="{{i18n.ngPagerLastTitle}}">' +
            '           <div class="ngPagerLastTriangle"><div class="ngPagerLastBar"></div></div></button>\n' +
            '       </div>\n' +
            '   </div>\n' +
            '</div>\n';
    };

$scope.gridOptions={
...
showFooter：是的，
footerTemplate:getCustomFooterTemplate（），
...
};
函数getCustomFooterTemplate（）{
返回“footerTemplate.html”，
“\n”+
“\n”+
“\n”+
“{i18n.ngTotalItemsLabel}{{maxRows（）}}”+
“（{i18n.ngShowingItemsLabel}”+
“{{totalFilteredItemsLength（）}}}）\n”+
“\n”+
“\n”+
“{i18n.ngSelectedItemsLabel}{{selectedItems.length}}\n”+
“\n”+
“\n”+
“\n”+
“\n”+
“{{i18n.ngPageSizeLabel}}\n”+
“\n”+
“{size}}}\n”+
“\n”+
“\n”+
“\n”+
'           ' +
“\n”+
“\n”+
{{maxRows（）}}中的{pagingOptions.currentPage}}到{{totalPages}}\n+
“\n”+
'           ' +
“\n”+
“\n”+
“\n”+
“\n”；
};

尝试角度数据表。做你想要的一切，还有更多。@johan:template内置？？你可以从

->paginate（）生成的json中获得所有这些信息

方法，但您必须编写一个脚本来在视图上更改它检查此@aaron0207：但我不使用laravel pagiantion，我使用angular如何？我不知道如何放置此方法您只需要为ui网格添加bower或npm，以适合您的为准，并简单地用作其他bower