Javascript 为什么ng表显示数据但没有分页设计
我能够显示数据,但为什么分页根本没有设计。即使我在索引页中包含了ng-table.min.css。 我下面的教程是链接 分页错误: 以下是我在控制器中的代码:Javascript 为什么ng表显示数据但没有分页设计,javascript,angularjs,angularjs-directive,angularjs-ng-repeat,ngtable,Javascript,Angularjs,Angularjs Directive,Angularjs Ng Repeat,Ngtable,我能够显示数据,但为什么分页根本没有设计。即使我在索引页中包含了ng-table.min.css。 我下面的教程是链接 分页错误: 以下是我在控制器中的代码: var module = angular.module('myApp.controller', ['myApp.service','ngTable']); module.controller('HomeController', ['HomeService', '$window','$filter', 'ngTableParams',
var module = angular.module('myApp.controller', ['myApp.service','ngTable']);
module.controller('HomeController', ['HomeService', '$window','$filter', 'ngTableParams',
function (HomeService, $window, $filter, ngTableParams) {
var self = this;
self.EmpData = [];
HomeService.getAllEmployeesTable().then(onSuccess, onError);
function onSuccess(response) {
self.EmpData = response.data;
self.usersTable = new ngTableParams({ page: 1, count: 4},
{
total: self.EmpData.length,
getData: function ($defer, params) {
self.data = self.EmpData.slice((params.page() - 1) * params.count(), params.page() * params.count());
$defer.resolve(self.data);
}});}
在我的部分html中,我有以下代码:
<div class="card-body">
<table ng-table ="home.usersTable" class="table table-striped">
<thead>
<tr>
<th>ContactId</th>
<th>Name</th>
<th>Email</th>
<th>Address</th>
<th>Telephone</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="rods in home.data">
<td>{{rods.contactId}}</td>
<td>{{rods.name}}</td>
<td>{{rods.email}}</td>
<td>{{rods.address}}</td>
<td>{{rods.telephone}}</td>
<td><a class="btn btn-outline-info" href="edit" role="button"
ng-click="home.Edit(rods)">Edit</a>
<button type="button" class="btn btn-outline-danger"
ng-click="home.deleteEmployee($index)">Delete</button>
</tr>
</tbody>
</table>
<a class="btn btn-primary" href="create" role="button">Add</a>
<button class="btn btn-outline-success my-2 my-sm-0" type="submit"
ng-click="home.test()">test</button>
</div>
联系人ID
名称
电子邮件
地址
电话
{{rods.contactId}
{{rods.name}
{{rods.email}
{{rods.address}
{{棒.电话}
删除
测试
请共享您的完整代码,以便我们可以看到您在HTML中引用的文件。分页样式可能是因为您没有添加引导CSS。请将此添加到HTML之上:这是我的索引。HTML:。。。顺便说一句,我已经在本地引用了bootstrap。@vijaymenni添加了在线bootstrap cdn,它出人意料地工作:D.这很奇怪,可能是因为我使用了.min版本吗?我想这是因为我使用了bootstrap的版本4。如果我使用3.3.7,我的分页有一个设计。如果我使用3.3.7版,我的ui设计被破坏,但分页有一个设计。LMAO请分享您的完整代码,以便我们可以看到您在HTML中引用的文件。分页样式可能是因为您没有添加引导CSS。请将此添加到HTML之上:这是我的索引。HTML:。。。顺便说一句,我已经在本地引用了bootstrap。@vijaymenni添加了在线bootstrap cdn,它出人意料地工作:D.这很奇怪,可能是因为我使用了.min版本吗?我想这是因为我使用了bootstrap的版本4。如果我使用3.3.7,我的分页有一个设计。如果我使用3.3.7版,我的ui设计被破坏,但分页有一个设计。笑死我了