Question

我是Angular 2的新手。目前我有一个使用angular2-datatable实现的表 - ＆gt; DataTableModule。

显示表格的代码如下所示：

    <table id="questionList" class="table table-striped" [mfData]="_question.questionList" #mf="mfDataTable" [mfRowsOnPage]="5" 
        [mfActivePage]="activePage" (onPageChange)="onPageChange($event)">
        <thead>      
            ......
        </thead>
        <tbody>
            ......
        </tbody>
        <tfoot>
        <tr>
            <td colspan="4">
                <mfBootstrapPaginator [rowsOnPageSet]="[5,10,25]"></mfBootstrapPaginator>
            </td>
        </tr>
        </tfoot>
    </table>

在我的.ts文件中，我有一个变量＆＃34; activePage：number = 2＆＃34;所以我希望我的数据列表中的第二个标签会显示出来。但遗憾的是它没有用。 Evertime我运行程序，它总是显示前5项而不是我表中的6-10项。

我还希望跟踪正在访问的最后一个活动页面。所以我把（mfOnPageChange）=＆＃34; onPageChange（$ event）。＆＃34;但我的.ts文件中的代码永远不会被调用。

onPageChange(event) {
  console.log("ON page change");
  this.activePage = event.activePage;
}

那么，在angular2-datatable中设置和获取activePage的最佳方法是什么 - ＆gt; DataTableModule。

由于

Answer 1

尝试使用mfBootstrapPaginator的（单击）方法，而不是在表中使用onPageChanges（）

<table id="questionList" class="table table-striped" [mfData]="_question.questionList" #mf="mfDataTable" [mfRowsOnPage]="5" 
    [mfActivePage]="activePage" >
    <thead>      
        ......
    </thead>
    <tbody>
        ......
    </tbody>
    <tfoot>
    <tr>
        <td colspan="4">
            <mfBootstrapPaginator [rowsOnPageSet]="[5,10,25]" (click)="onPageChange(mf)"></mfBootstrapPaginator>
        </td>
    </tr>
    </tfoot>
</table>

Answer 2

确保您的循环超过mf.data

<tr *ngFor="#item of mf.data">

这里有一个plunk working

在angular2-datatable中设置并获取活动页面

2 个答案: