dirPaginate不使用ng-repeat-start（对于可扩展表）

Question

我正在使用一个消耗表，代码在

之下

<table class="table table-condensed table-bordered">
    <thead>
        <tr>
            <th>
            </th>
            <th>S. No.</th>
            <th>Position</th>
            <th>Reporting to</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="position in listPositiondtls | itemsPerPage:10" current-page="currentPage">
            <td>
                <button ng-click="expanded = !expanded">
                    <span ng-bind="expanded ? '-' : '+'"></span>
                </button>
            </td>
            <td >{{$index+1}}</td>
            <td>{{position.positionName}}</td>
            <td>{{position.reportingToName}}</td>
        </tr>
        <tr ng-show="expanded">
            <td></td>
            <td colspan="3">
                <div class="col-lg-6 margin_all">
                    <span>Department Code: {{position.depCode}}</span>
                </div>
                <div class="col-lg-6 margin_all">
                    <span>Department Name: {{position.depName}}</span>
                </div>
                <div class="col-lg-6 margin_all">
                    <span>Position Name: {{position.positionName}}</span>
                </div>
                <div class="col-lg-6 margin_all">
                    <span>Is He HOD: 
                        <label>
                            <input type="checkbox" ng-model="position.isHeadofdepartment">
                            <span class="text"></span>
                        </label>
                    </span>
                </div>
            </td>
        </tr>
    </tbody>
</table>

这里我对可扩展表使用ng-repeat-start指令。 但分页显示此警报：

Pagination directive: the pagination controls cannot be used without the corresponding pagination directive, which was not found at link time.

并出错：

pagination directive: the itemsPerPage id argument (id: __default) does not match a registered pagination-id.

帮助我，我需要在可扩展表格中加入分页。

Answer 1

我认为你有2个错误。

• dirPaginate需要使用dir-paginate代替ng-repeat。
• 您需要使用分页控件directive。

要解决您的问题，请执行下一步：

• 在ng-repeat
的dir-paginate上更改ng-repeat="position in listPositiondtls | itemsPerPage:10"
• 添加html <dir-pagination-controls></dir-pagination-controls>

修改后的html

<dir-pagination-controls></dir-pagination-controls> 
<table class="table table-condensed table-bordered">
<thead>
    <tr>
        <th>
        </th>
        <th>S. No.</th>
        <th>Position</th>
        <th>Reporting to</th>
    </tr>
</thead>
<tbody>
    <tr dir-paginate="position in listPositiondtls | itemsPerPage:10" current-page="currentPage">
        <td>
            <button ng-click="expanded = !expanded">
                <span ng-bind="expanded ? '-' : '+'"></span>
            </button>
        </td>
        <td >{{$index+1}}</td>
        <td>{{position.positionName}}</td>
        <td>{{position.reportingToName}}</td>
    </tr>
    <tr ng-show="expanded">
        <td></td>
        <td colspan="3">
            <div class="col-lg-6 margin_all">
                <span>Department Code: {{position.depCode}}</span>
            </div>
            <div class="col-lg-6 margin_all">
                <span>Department Name: {{position.depName}}</span>
            </div>
            <div class="col-lg-6 margin_all">
                <span>Position Name: {{position.positionName}}</span>
            </div>
            <div class="col-lg-6 margin_all">
                <span>Is He HOD: 
                    <label>
                        <input type="checkbox" ng-model="position.isHeadofdepartment">
                        <span class="text"></span>
                    </label>
                </span>
            </div>
        </td>
    </tr>
</tbody>