带有数据表的流星:Meteor._atFlush TypeError [英] Meteor with DataTables: Meteor._atFlush TypeError
本文介绍了带有数据表的流星:Meteor._atFlush TypeError的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试将 DataTables(通过 mrt add datatables)与 Meteor 一起使用.我曾多次尝试将 $('#mytableid').dataTable() 添加到 Meteor.subscribe 回调，Meteor.autorun，Meteor.startup 和 Template.mytemplate.rendered -- 都导致以下异常和 表中无可用数据 消息.>
有什么指点吗?
来自 Meteor._atFlush 的异常:TypeError:无法调用 null 的方法insertBefore"在 http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:405:27在 LiveRange.operate (http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:459:11)在 LiveRange.replaceContents (http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:403:17)在 http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:996:37在 withEventGuard (http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:105:16)在 http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:981:9在 http://localhost:3000/packages/deps/deps-utils.js?f3fceedcb1921afe2b17e4dbd9d4c007f409eebb:106:13在 http://localhost:3000/packages/deps/deps.js?1df0a05d3ec8fd21f591cfc485e7b03d2e2b6a01:71:15在 Array.forEach(本机)在 Function._.each._.forEach (http://localhost:3000/packages/underscore/underscore.js?47479149fe12fc56685a9de90c5a9903390cb451:79:11)更新:可能与这个问题，为此找到的最佳解决方案是为每一行调用 dataTable() —— 在这种情况下并不理想，而且鉴于行的数量非常多，这对我来说可能是灾难性的.
解决方案
Dror 的答案无疑是正确的开始.这是我目前看到的最佳实践:
HTML
{{#持续的}}<table class="table table-striped" id="tblData">{{/持续的}}JS:
Template.data_table.created = function() {var _watch = Collection.find({});var 句柄 = _watch.observe({addedAt: 函数 (doc, atIndex, beforeId) {$('#tblData').is(":visible") &&$('#tblData').dataTable().fnAddData(doc);}，changedAt:函数(newDoc，oldDoc，atIndex){$('#tblData').is(":visible") &&$('#tblData').dataTable().fnUpdate(newDoc, atIndex);}，removedAt:函数(oldDoc，atIndex){$('#tblData').is(":visible") &&$('#tblData').dataTable().fnRemove(atIndex);}});};Template.data_table.rendered = function () {if (!($("#tblData").hasClass("dataTable"))) {$('#tblStudents').dataTable({a排序":[], "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>", "sPaginationType": "引导程序", "语言": {"sLengthMenu": "_MENU_ 每页记录"}, "aoColumns": [{ "sTitle": "First Data", "mData": function (data) { return data.firstData },]});$('#tblData').dataTable().fnClearTable();$('#tblData').dataTable().fnAddData(Collection.find().fetch());}};I'm trying to use DataTables (via mrt add datatables) with Meteor. I've variously tried adding the $('#mytableid').dataTable() to the Meteor.subscribe callback, Meteor.autorun, Meteor.startup, and Template.mytemplate.rendered -- all resulting in the following exception and a No data available in table message.
Any pointers?
Exception from Meteor._atFlush: TypeError: Cannot call method 'insertBefore' of null
at http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:405:27
at LiveRange.operate (http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:459:11)
at LiveRange.replaceContents (http://localhost:3000/packages/liverange/liverange.js?bc1d62454d1fefbec95201344b27a7a5a7356293:403:17)
at http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:996:37
at withEventGuard (http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:105:16)
at http://localhost:3000/packages/spark/spark.js?c202b31550c71828e583606c7a5e233ae9ca50e9:981:9
at http://localhost:3000/packages/deps/deps-utils.js?f3fceedcb1921afe2b17e4dbd9d4c007f409eebb:106:13
at http://localhost:3000/packages/deps/deps.js?1df0a05d3ec8fd21f591cfc485e7b03d2e2b6a01:71:15
at Array.forEach (native)
at Function._.each._.forEach (http://localhost:3000/packages/underscore/underscore.js?47479149fe12fc56685a9de90c5a9903390cb451:79:11)
Update: Potentially related to this issue, for which the best solution found was to call dataTable() for each row -- not ideal in that case, and potentially catastrophic in mine given the very large number of rows.
解决方案
Dror's answer is the right start for sure. Here's the best practice the way I see it currently:
HTML
<template name="data_table">
{{#constant}}
<table class="table table-striped" id="tblData">
</table>
{{/constant}}
</template>
JS:
Template.data_table.created = function() {
var _watch = Collection.find({});
var handle = _watch.observe({
addedAt: function (doc, atIndex, beforeId) {
$('#tblData').is(":visible") && $('#tblData').dataTable().fnAddData(doc);
}
, changedAt: function(newDoc, oldDoc, atIndex) {
$('#tblData').is(":visible") && $('#tblData').dataTable().fnUpdate(newDoc, atIndex);
}
, removedAt: function(oldDoc, atIndex) {
$('#tblData').is(":visible") && $('#tblData').dataTable().fnRemove(atIndex);
}
});
};
Template.data_table.rendered = function () {
if (!($("#tblData").hasClass("dataTable"))) {
$('#tblStudents').dataTable({
"aaSorting": []
, "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>"
, "sPaginationType": "bootstrap"
, "oLanguage": {
"sLengthMenu": "_MENU_ records per page"
}
, "aoColumns": [
{ "sTitle": "First Data", "mData": function (data) { return data.firstData },
]
});
$('#tblData').dataTable().fnClearTable();
$('#tblData').dataTable().fnAddData(Collection.find().fetch());
}
};
这篇关于带有数据表的流星:Meteor._atFlush TypeError的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
