smart table using pagination angular

Question

Using Angular smart table lib:

I just want to display the pagination buttons on the bottom. According to the documentation, it looks like st-pagination directives inserts those dom elements in there. However, for me, it is not working. Here is the plunker given by the smart table documentation:http://plnkr.co/edit/wzUHcc9PBF6tzH8iAEsn?p=preview

Here is my table footer code:

<tfoot>
  <tr>
    <td colspan="5" class="text-center">
      <div st-items-by-page="10" st-pagination="">
      </div>
    </td>
  </tr>
</tfoot>

I must be misunderstanding something. I know you can put your own customized template for the pagination.

Here is a screenshot, of the output and debugger:

Can you provide a JSfiddle or Plunker to show the problem you have? — leo.fcx
@leo.fcx - Sorry, its quite a big of an application. I threw in a screenshot with a debugger to show whats going on. — Kenta Goto
@SteamDev - Yes, I have 23 rows and st-items-by-page attribute is set to 10. — Kenta Goto
How many columns are there in the <tbody> ? <tfoot> colspan="5" . But <tbody> can be column more than <tfoot> — barış çıracı

redpeaks redpeaks · Accepted Answer · 2017-01-15T04:53:06

You should use <td> tag only. you should not use <div> tag.

OK

<td colspan="5" class="text-center" st-items-by-page="10" st-pagination="">
</td>

NG

<td colspan="5" class="text-center">
  <div st-items-by-page="10" st-pagination="">
  </div>
</td>

smart table using pagination angular

1 Answers