DataTable Bootstrap不能与AngularJs一起使用
我正在尝试将DataTable Bootstrap与AngularJs一起使用,但DataTable的工作方式就像表中没有数据一样。 在下面的代码中,我有两张桌子。 第一个使用AngularJs,第二个只使用纯HTML。
我需要做什么才能使第一个表像第二个表一样工作?
谢谢,人!
Name Country {{x.Name}} {{x.Country}} >
Rendering engine Browser Platform(s) Engine version CSS grade Trident Internet Explorer 4.0 Win 95+ 4 X Trident Internet Explorer 5.0 Win 95+ 5 C Trident Internet Explorer 5.5 Win 95+ 5.5 A Trident Internet Explorer 6 Win 98+ 6 A Trident Internet Explorer 7 Win XP SP2+ 7 A Trident AOL browser (AOL desktop) Win XP 6 A Gecko Firefox 1.0 Win 98+ / OSX.2+ 1.7 A Gecko Firefox 1.5 Win 98+ / OSX.2+ 1.8 A Gecko Firefox 2.0 Win 98+ / OSX.2+ 1.8 A Gecko Firefox 3.0 Win 2k+ / OSX.3+ 1.9 A Gecko Camino 1.0 OSX.2+ 1.8 A Gecko Camino 1.5 OSX.3+ 1.8 A Gecko Netscape 7.2 Win 95+ / Mac OS 8.6-9.2 1.7 A Gecko Netscape Browser 8 Win 98SE+ 1.7 A Gecko Netscape Navigator 9 Win 98+ / OSX.2+ 1.8 A Gecko Mozilla 1.0 Win 95+ / OSX.1+ 1 A Gecko Mozilla 1.1 Win 95+ / OSX.1+ 1.1 A Gecko Mozilla 1.2 Win 95+ / OSX.1+ 1.2 A Gecko Mozilla 1.3 Win 95+ / OSX.1+ 1.3 A Gecko Mozilla 1.4 Win 95+ / OSX.1+ 1.4 A Gecko Mozilla 1.5 Win 95+ / OSX.1+ 1.5 A Gecko Mozilla 1.6 Win 95+ / OSX.1+ 1.6 A Gecko Mozilla 1.7 Win 98+ / OSX.1+ 1.7 A Gecko Mozilla 1.8 Win 98+ / OSX.1+ 1.8 A Gecko Seamonkey 1.1 Win 98+ / OSX.2+ 1.8 A Gecko Epiphany 2.20 Gnome 1.8 A Webkit Safari 1.2 OSX.3 125.5 A Webkit Safari 1.3 OSX.3 312.8 A Webkit Safari 2.0 OSX.4+ 419.3 A Webkit Safari 3.0 OSX.4+ 522.1 A Webkit OmniWeb 5.5 OSX.4+ 420 A Webkit iPod Touch / iPhone iPod 420.1 A Webkit S60 S60 413 A Presto Opera 7.0 Win 95+ / OSX.1+ - A Presto Opera 7.5 Win 95+ / OSX.2+ - A Presto Opera 8.0 Win 95+ / OSX.2+ - A Presto Opera 8.5 Win 95+ / OSX.2+ - A Presto Opera 9.0 Win 95+ / OSX.3+ - A Presto Opera 9.2 Win 88+ / OSX.3+ - A Presto Opera 9.5 Win 88+ / OSX.3+ - A Presto Opera for Wii Wii - A Presto Nokia N800 N800 - A Presto Nintendo DS browser Nintendo DS 8.5 C/A1 KHTML Konqureror 3.1 KDE 3.1 3.1 C KHTML Konqureror 3.3 KDE 3.3 3.3 A KHTML Konqureror 3.5 KDE 3.5 3.5 A Tasman Internet Explorer 4.5 Mac OS 8-9 - X Tasman Internet Explorer 5.1 Mac OS 7.6-9 1 C Tasman Internet Explorer 5.2 Mac OS 8-X 1 C Misc NetFront 3.1 Embedded devices - C Misc NetFront 3.4 Embedded devices - A Misc Dillo 0.8 Embedded devices - X Misc Links Text only - X Misc Lynx Text only - X Misc IE Mobile Windows Mobile 6 - C Misc PSP browser PSP - C Other browsers All others - - U Rendering engine Browser Platform(s) Engine version CSS grade
var app = angular.module('testApp', []); app.controller('testCtrl', function($scope, $http) { $http.get("http://www.w3schools.com/angular/customers_mysql.php").success(function (response) { $scope.names = response.records;}); }); $(document).ready(function() { $('#example').dataTable(); $('#example2').dataTable(); });
我使用下面的代码解决了我的问题。 过滤,分页和排序都很好。
下载angular-datatable并将angular-datatables.min.js文件放入项目中,就像我在行中所做的那样
Name City Country {{name.Name}} {{name.City}} {{name.Country}}