3

So I got a Smart-table for witch I reload the entire data-set (I need it for a graph). but I don't want all data to get rendered at once (got too many). So in the documentation there is something called "Client Side Pagination" but that does not seem to work for some reason. objectDataArr[0] holds the entire data-set

My mock up is:

<div class="container">
    <div class="row">
        <div class="col-md-4">
            <h1><strong>Preview Data: {{objectTranslations[objectData.LangKey]}}</strong></h1>
        </div>
        <div class="col-md-8">
        </div>
    </div>
    <div class="row">
        <table st-table="objectDataArr[0]" class="table table-striped">
            <thead>
                <tr>
                    <th ng-repeat="col in objectData.Tables[0].Columns" st-sort="col.Code" ng-class="{'dd-vh-2':col.Length<=25 , 'dd-vh-5':col.Length>25 && col.Length<=50, 'dd-vh-10':col.Length>50 && col.Length<=100, 'dd-vh-15':col.Length>100 && col.Length<=150, 'dd-vh-20':col.Length>150 && col.Length<=250}">{{objectTranslations[col.LangKey]}}</th>
                </tr>
                <tr>
                    <th ng-repeat="col in objectData.Tables[0].Columns" ng-class="{'dd-vh-2':col.Length<=25 , 'dd-vh-5':col.Length>25 && col.Length<=50, 'dd-vh-10':col.Length>50 && col.Length<=100, 'dd-vh-15':col.Length>100 && col.Length<=150, 'dd-vh-20':col.Length>150 && col.Length<=250}">
                        <input placeholder="Search ..." st-search="col.Code" />
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="row in objectDataArr[0]">
                    <td ng-repeat="col in objectData.Tables[0].Columns" ng-class="{'dd-selected': row.showRowButtons == true, 'dd-vh-2':col.Length<=25 , 'dd-vh-5':col.Length>25 && col.Length<=50, 'dd-vh-10':col.Length>50 && col.Length<=100, 'dd-vh-15':col.Length>100 && col.Length<=150, 'dd-vh-20':col.Length>150 && col.Length<=250}">
                        <span class="dd-cell">{{row[col.Code]}}</span>
                    </td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td colspan="5" class="text-center">
                        <div st-pagination="" st-items-by-page="20" st-displayed-pages="7"></div>
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
</div>
4

2 回答 2

15

问题是,如果您异步加载数据,如果我理解您的描述,您可能会这样做,您需要告诉 smart-table 监视源集合,以便在发生更改时刷新它。为此,您需要使用st-safe-src

<table st-safe-src="objectDataArr[0]" st-table="whateverVarYouWantToUseInTheTemplate">
   <tr ng-repeat="item in whateverVarYouWantToUseInTheTemplate"></tr>
</table>
于 2015-04-20T02:20:56.620 回答
2

如果您像我一样酷,您可能忘记将依赖项传递给您的应用程序

angular.module('app', ['ngRoute', 'smart-table'])
于 2017-02-09T21:52:35.100 回答