AngularJS Smart-Table 客户端分页 - 所需的 AngularJS 最低版本是什么?

AngularJS Smart-Table Client Side Pagination - What is the minimum version of AngularJS required?

提问人:Anthony S 提问时间:9/20/2016 最后编辑:JanmenjayaAnthony S 更新时间:9/20/2016 访问量:676

问:

我正在开发一个在智能表中显示数据的网页,因为我需要允许用户选择多行进行处理。

我使用的是版本 1.3.20。AngularJS

我有一个测试网页,我在该网页上复制了在 GitHub (lorenzofox2.github.io/smart-table-website) 上找到的示例。我将提供的表格脚本复制到我的测试中。我将提供的脚本复制到我的客户端控制器中。我通过我的应用程序执行网页。此时将打开网页,并显示相应的数据。网页不会在页脚中显示所定义的分页。我不知道为什么分页没有显示。HTMLJavaScript

下面列出了 、 和 结果HTMLJavaScript

HTML格式 :

<div class="smart-table">
<table st-table="rowCollection" class="table table-striped">
<thead>
<tr>
  <th st-sort="firstName">first name</th>
  <th st-sort="lastName">last name</th>
  <th st-sort="birthDate">birth date</th>
  <th st-sort="balance">balance</th>
  <th>email</th>
</tr>
<tr>
  <th>
    <input st-search="'firstName'" placeholder="search for firstname" class="input-sm form-control" type="search"/>
  </th>
  <th colspan="4">
    <input st-search placeholder="global search" class="input-sm form-control" type="search"/>
  </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in rowCollection">
  <td>{{row.firstName | uppercase}}</td>
  <td>{{row.lastName}}</td>
  <td>{{row.birthDate | date}}</td>
  <td>{{row.balance | currency}}</td>
  <td><a ng-href="mailto:{{row.email}}">email</a></td>
</tr>
</tbody>
<tfoot>
  <tr>
    <td colspan="5" class="text-center">
      <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="7"></div>
    </td>
  </tr>
</tfoot>
</table>
</div>

JavaScript的:

var
    nameList = ['Pierre', 'Pol', 'Jacques', 'Robert', 'Elisa'],
    familyName = ['Dupont', 'Germain', 'Delcourt', 'bjip', 'Menez'];

function createRandomItem() {
    var
        firstName = nameList[Math.floor(Math.random() * 4)],
        lastName = familyName[Math.floor(Math.random() * 4)],
        age = Math.floor(Math.random() * 100),
        email = firstName + lastName + '@whatever.com',
        balance = Math.random() * 3000;

    return{
        firstName: firstName,
        lastName: lastName,
        age: age,
        email: email,
        balance: balance
    };
}

$scope.itemsByPage=15;

$scope.rowCollection = [];
for (var j = 0; j < 200; j++) {
    $scope.rowCollection.push(createRandomItem());
}

结果

enter image description here

我希望有人能告诉我我是否使用了 .如果是这样,我希望有人能引导我进入我错过的东西?AngularJS

JavaScript AngularJS 分页客户端 智能表

评论


答:

0赞 Anthony S 9/20/2016 #1

经过进一步搜索,此问题是运行 smart-table 版本 1.3.0 而不是 2.1.8 的结果。将 angular-smart-table 升级到版本 2.1.8 后,问题已解决