DataTables加载数据，但是按钮和排序在Angular 4中不能正常工作
在Angular 4中，DataTables加载数据后，按钮和排序可能无法正常工作的原因是由于Angular的变化检测机制导致的。Angular使用了自己的变化检测机制来跟踪组件和模板之间的数据变化，以便及时更新视图。
要解决这个问题，可以尝试以下几种方法：
- 手动触发变化检测：在数据加载完成后，可以使用
ChangeDetectorRef服务手动触发变化检测。首先在组件的构造函数中注入ChangeDetectorRef，然后在数据加载完成后调用detectChanges()方法。这样可以强制Angular检测到数据的变化并更新视图。 - 使用
ngZone：ngZone是Angular提供的一个服务，用于管理和执行JavaScript代码的运行环境。可以将数据加载的代码放在ngZone.run()方法中，这样可以确保代码在Angular的变化检测机制下执行，从而解决按钮和排序无法正常工作的问题。 - 使用
setTimeout()延迟执行：在数据加载完成后，可以使用setTimeout()函数将按钮和排序的初始化代码延迟执行。这样可以让Angular先完成变化检测，然后再执行按钮和排序的初始化代码，确保它们能够正常工作。
以上是解决按钮和排序无法正常工作的一些常见方法，具体使用哪种方法取决于你的具体情况和需求。另外，DataTables是一个功能强大的表格插件，可以实现数据的排序、搜索、分页等功能。在Angular中，你可以使用ngx-datatable等类似的插件来实现类似的功能。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云数据库（TencentDB）。腾讯云云服务器提供了可靠的计算能力，可以满足各种规模的应用需求。腾讯云数据库提供了高性能、可扩展的数据库服务，支持多种数据库引擎，适用于各种应用场景。
腾讯云云服务器产品介绍链接地址：https://cloud.tencent.com/product/cvm 腾讯云数据库产品介绍链接地址：https://cloud.tencent.com/product/tencentdb
相关·内容
我有一个Angular 4项目，我正在尝试使用库以表格格式显示我的数据。我能够处理他们网站上的硬编码数据。我有所有的按钮(复印，打印，excel)工作正常。但是，当我尝试显示我使用服务从SQL数据库中获取的数据时，我可以在表中显示数据，但所有按钮都不起作用。我甚至在表格中有No data available in table文本。/_services&#
浏览 1提问于2018-08-15得票数 1
回答已采纳
我在我的angular应用程序中使用了datatables.net和yadcf插件。数据是通过ajax请求加载的。现在，第一次加载页面时，一切工作正常。如果我执行ctrl + F5来强制刷新，那么一切都会再次正常工作。你知道是什么导致第二次加载抛出下面的错误吗？<anonymous> (datatables-angular.js:13
浏览 1提问于2016-02-12得票数 0
我正在尝试在我的Rails3应用程序中重新创建。javascript文件，但我一直收到这个错误：我直接复制了他的HTML和javascript编辑:我猜文件是以错误的顺序加载的，因为当我查看我的控制台时，这是我看到的：Processing
浏览 0提问于2012-03-30得票数 0
回答已采纳
我在一个项目中使用。但是，它的行为与数据表不同。未加载排序。有没有办法让我检查一下datatables是否已经加载？在我的页面中，我有以下内容：
<link href="/libs/datatables/media/css/jquery.dataTables.min.css" rel="stylesheet"/&
浏览 6提问于2014-11-05得票数 3
在angular slickgrid中，按列排序asc/desc效果很好。但是删除按列标题排序菜单不能正常工作。当我移除排序时，应将数据集重置为初始加载的数据视图。但它保持了最后的排序顺序。当我清除所有按网格排序菜单时，它工作得很好。在这里我分享了我的问题案例作为gif文件，任何人请帮助我解决这个问题。 ?
浏览 24提问于2020-06-21得票数 0
回答已采纳
2回答
我使用的是jQuery DataTables，我有一个使用foreach循环生成的表。在生成的每一行中，将生成2个按钮，并将不同的数字添加到data属性中。在页面加载之后，dataTables开始工作并呈现表格。我有一个onClick处理程序，它在单击按钮时响应按钮。但是，当我对dataTables能够完成的表列进行排序时，按钮根本不响应onClick处理程序。
当使用任何一个<e
浏览 3提问于2015-06-01得票数 1
使用Angular4和angular-datatables。
一切看起来都很正常(分页、列排序、导出按钮)，但是当我尝试打印/复制/导出表时，它只输出标题，即使其余的数据都在那里。
浏览 2提问于2019-09-09得票数 2
1回答
我有一个具有排序、搜索和页行限制功能的JQuery数据表。搜索运行得很好。<script> $('#dataTables-example&#x
浏览 0提问于2017-03-13得票数 1
我从已经排序的数据库中检索数据，有时我需要重置回初始加载顺序。我已经尝试过这个fnSortNeutral，它不能与新的DataTables 1.10接口一起工作。然后我尝试了这个
$('#removesort').click( function() {
浏览 0提问于2015-10-19得票数 3
2回答
我正在使用NGX Datatables，除了日期之外，我的所有数据都是正确排序的。似乎NGX的内置排序是从左到右排序的，所以它是按月/日排序的，而不是按年排序的。我正在尝试使用这种格式('MM-DD-YYYY h:mm A')进行排序。如果我改成这种格式('YYYY-MM-DDh:mm A')，它就能正常工作。我看到其他人说使用angular中的竖线
浏览 3提问于2018-11-15得票数 0
我要添加excel，复制，pdf，打印按钮的角度js。但我在数据表中显示按钮时出错。数据表工作正常，但当我添加按钮代码时，datatable没有工作错误。未明误差：$injector:modulerr
<script src="~/angularjs/jquery.js"></script>
<script src=&qu
浏览 0提问于2019-01-03得票数 1
1回答
函数在表排序后停止工作。
、、、
我目前有一个表，该表按照DataTables与引导集成进行排序。在我的最后一栏中，我有一个按钮组(编辑、完成等)，在单击时应该调用函数。这些按钮是在php while循环中使用以下代码创建的，数据id是javascript需要接收的变量。Javascript： var id = $(this).data("id");
alert(
浏览 1提问于2013-12-18得票数 1
回答已采纳
2回答
但是，当我尝试有第二个可选择的表时，它不会在单击时选择。但它会显示信息消息"click to select“。在加载dataTables.js本身之后，我已经加载了dataTables.select.min.js文件。(即使不加载dataTables.select.min.js，它也可以在站点的第一个表上工作，但我想确认一下。)
我也尝试在初始化后应用table.select()，它也不起
浏览 0提问于2017-11-21得票数 1
回答已采纳
在我的应用程序中安装dataTables插件时，我发现了一些我认为非常奇怪的东西。我在rails 4.2上使用ruby。如果我的资产中只有缩小的或非缩小的js和css jquery.dataTables文件，排序图标就不能正确加载。奇怪的是，如果我使用min.css和常规js文件，排序图标就会正确加载！：不工作
jquery.dataTables.min.css
浏览 3提问于2016-08-04得票数 2
回答已采纳
我在国家预防机制中使用以下内容： "angular": "1.6.4", "datatables.net-buttonsthat is not question related现在，当我在示例中创建一个像角数据这样的DataTable时，一切都很好。_0&q
浏览 1提问于2018-07-11得票数 3
回答已采纳
2回答
我有一个工作的jQuery DataTable ()，它在其中一个列的每一行中都使用带有<span>元素的TableTools插件。
在单击导出按钮时，我想隐藏/删除导出文件中的<span>元素。
浏览 2提问于2015-06-05得票数 2
2回答
我遵循了以下说明：，但我不能理解分页(既不是在bJQuery模式下，也不是在经典模式下)。一切工作正常(搜索，排序，...)但是我不能得到分页。/* */if ( isset( $_GET['iDisplayStartmysql_
浏览 2提问于2012-01-24得票数 4
回答已采纳
1回答
数据表移除所有行
、、、
我使用DataTables和Bootstrap gentelella。当数据表有一些记录时，它们工作得很好。当我打开表格中有空数据的页面，转到创建页面并返回时，我发现DataTables不能正常工作。$('#table-programm-station') "language": {
&qu
浏览 0提问于2017-06-28得票数 0
我一直在使用DataTables 1.9.4，所有东西看起来都很好，格式也很好，但我在排序列时遇到了一些问题。在页面加载时，我用数据填充表，然后使用JS更改一些值。数据更改后，排序功能似乎不再正常工作。我运行了几个测试，发现输入的初始数据是保存的，并且总是按该值排序，而不是按当前值排序。我想知道是否有任何方法可以让它保存新值并按这些值排序
浏览 1提问于2013-01-31得票数 2
回答已采纳
1回答
我使用DataTables获得了一个DataTables闪亮的服务器页面，并让TableTools和ColReorder在下面的示例中工作，但是ColVis (Show/hide columns按钮)的行为方式与中的示例不同：
浏览 7提问于2014-07-08得票数 9
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
