смарт-таблица пейджер не работает

У меня есть проект Asp.net MVC с AngularJs в качестве фреймворка javascript.

Я использую угловой плагин smart-table для своих требований к таблице\сетке. Все работает нормально, но пейджер вообще не отображается на странице.

Ниже мой html-код:

<div data-ng-controller="gridcontroller" class="row">
    <label>Grid demo</label>
    <table data-st-table="griddata" class="table striped">
        <thead>
            <tr>
                <th>first name</th>
                <th>last name</th>
                <th>birth date</th>
                <th>balance</th>
                <th>email</th>
            </tr>
        </thead>
        <tbody>
            <tr data-ng-repeat="row in griddata">
                <td data-ng-bind='row.firstName'></td>
                <td data-ng-bind='row.lastName'></td>
                <td data-ng-bind='row.birthDate'></td>
                <td data-ng-bind='row.balance'></td>
                <td data-ng-bind='row.email'></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="5" class="text-center">
                    <div st-template="~/Scripts/Angular/Plugins/pagination.html" st-pagination="" 
st-items-by-page="10">
                    </div>
                </td>
            </tr>
        </tfoot>
    </table>

Разметка Pagination.html выглядит следующим образом:

<div class="pagination" ng-if="pages.length >= 2">
<ul class="pagination">
    <li ng-if="currentPage > 1">
        <a ng-click="selectPage(1)">&lt;&lt;</a>
    </li>
    <li ng-if="currentPage > 1">
        <a ng-click="selectPage(currentPage-1)">&lt;</a>
    </li>
    <li ng-repeat="page in pages" ng-class="{active: page==currentPage}">
        <a ng-click="selectPage(page)">{{page}}</a>
    </li>
    <li ng-if="currentPage < numPages">
        <a ng-click="selectPage(currentPage+1)">></a>
    </li>
    <li ng-if="currentPage < numPages">
        <a ng-click="selectPage(numPages)">>></a>
    </li>
</ul>

Когда я запускаю сайт, я вижу сетку со всеми записями (60 в моем случае), а разметка pager показана ниже:

<tfoot>
   <tr>
      <td colspan="5" class="text-center">
           <div st-template="/Scripts/Angular/Plugins/pagination.html"                           st-pagination="" st-items-by-page="itemsByPage" class="ng-isolate-scope">
               <!-- ngIf: pages.length >= 2 -->
          </div>
      </td>
   </tr>
 </tfoot>

Я сделал все шаги, как указано на сайте, но не могу заставить работать пейджер. Любая помощь приветствуется.


person Sanjay Sutar    schedule 18.05.2015    source источник
comment
Я нашел проблему. Атрибут st-table отсутствовал. ‹table data-st-table=griddataDisplayedCollection class=table striped st-safe-src=griddata › Но теперь появилась новая проблема. Щелчок по номерам страниц ничего не делает. Есть предположения, что не так?   -  person Sanjay Sutar    schedule 18.05.2015


Ответы (1)


Привет, если вы используете разбивку на страницы на стороне сервера, вам нужно сообщить смарт-таблице о количестве страниц, чтобы она получила представление о страницах, которые она собирается отображать, и привязать к ней свое событие.

tablestate.pagination.numberOfPages = response.totalPages;

вы должны установить общее количество страниц из ответа на свойство numberOfPages объекта разбиения на страницы состояния таблицы.

person Avinash Solanki    schedule 20.05.2015