加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularjs – 智能表 – 从代码设置页面

发布时间:2020-12-17 10:18:33 所属栏目:安全 来源:网络整理
导读:我正在使用非常好的表库 Smart-table来显示我的数据. 我正在使用自定义分页模板.但是,我希望能够从代码中设置第1页.我已经阅读了它暴露的st-pipe指令,但是如果我实现它,我似乎需要自己重写整个过滤/分页/排序代码. 我正在用一种简单的方法以编程方式设置一个
我正在使用非常好的表库 Smart-table来显示我的数据.

我正在使用自定义分页模板.但是,我希望能够从代码中设置第1页.我已经阅读了它暴露的st-pipe指令,但是如果我实现它,我似乎需要自己重写整个过滤/分页/排序代码.

我正在用一种简单的方法以编程方式设置一个页面,该页面来自我的表格中存在的st-pagination指令

<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指令.

有谁知道这是否可能?非常感谢.

要从代码中设置angular-smart-table页码,请使用st-pagination的selectPage()函数.

你的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/

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读