Smart-table - настройка страницы из кода

Question

Я использую очень хорошую библиотеку таблиц Smart-table для отображения моих данных.

Я использую настраиваемый шаблон для разбивки на страницы. Тем не менее я хотел бы иметь возможность установить страницу 1 из кода. Я прочитал в директиве st-pipe, которую он предоставляет, но мне кажется, что мне нужно будет переписать весь код фильтрации/разбивки на страницы/сортировку сам, если я это реализую.

Я после того, как простой способ программно установить страницу из-за пределов st-pagination директивы, которая существует в моей таблицы tfoot

<table st-table="displayedCollection" st-safe-src="tags" class="table table-hover"> 
    <tbody> 
     <tr st-select-row="tag" st-select-mode="single" ng-repeat="tag in displayedCollection" ng-click="click(tag)"> 
      <td> 
       <span editable-text="tag.name" e-placeholder="enter a display name..." e-name="name" e-form="editableForm" e-required> 
       {{tag.name}}</span> 
      </td> 
      <td> 
       <span editable-text="tag.path" e-placeholder="enter actual value to be used..." e-name="path" e-form="editableForm" e-required> 
       {{tag.path}}</span> 
      </td> 
      <td> 
       <form editable-form shown="newItem == tag" onshow="onShow()" name="editableForm" oncancel="oncancel(newItem)" onaftersave="saveForm(tag)"> 
        <!-- EDIT --> 
        <button type="button" class="btn btn-sm btn-default" ng-click="editableForm.$show()" tooltip="Edit" tooltip-placement="left" ng-hide="editableForm.$visible"> 
         <i class="fa fa-pencil-square-o fa-lg"></i> 
        </button> 
       </form> 
      </td> 
     </tr> 
    </tbody> 
    <tfoot> 
     <tr> 
      <td colspan="1" class="text-left"> 
       <div st-template="app/partials/pagination.html" st-pagination="" st-items-by-page="pager.itemsOnPage"></div> 
      </td> 
      <td colspan="1"> 
       <div class="btn-group btn-group-sm pull-right ng-scope"> 
        <button type="button" ng-class="{'active':pager.itemsOnPage==5}" ng-click="pager.itemsOnPage=5" class="btn btn-default">5</button> 
        <button type="button" ng-class="{'active':pager.itemsOnPage==10}" ng-click="pager.itemsOnPage=10" class="btn btn-default">10</button> 
        <button type="button" ng-class="{'active':pager.itemsOnPage==20}" ng-click="pager.itemsOnPage=20" class="btn btn-default">20</button> 
        <button type="button" ng-class="{'active':pager.itemsOnPage==30}" ng-click="pager.itemsOnPage=30" class="btn btn-default">30</button> 
       </div> 
      </td> 
     </tr> 
    </tfoot> 
</table> 

Я хотел бы быть в состоянии установить страницу на <form> из секций onshow директива.

Кто-нибудь знает, возможно ли это? Большое спасибо.

Answer 1

Чтобы задать номер страницы с угловым умным столом из кода, используйте функцию selectPage() для разбивки на st-pagination.

Где ваш HTML имеет Paginator элемент вроде этого:

<div id="pagerId" st-pagination="" st-items-by- ... 

Вы можете использовать код, как это в вашей директиве

function setPage(pageNumber) 
{ 
    angular 
     .element($('#pagerId')) 
     .isolateScope() 
     .selectPage(pageNumber); 
} 

Вы должны иметь JQuery установлен использовать $. У меня возникла идея из последнего примера: http://lorenzofox3.github.io/smart-table-website/