我一直在使用伟大的插件yadcf作为datatables库 . 我一直在使用asp.net mvc 5的视图中没有问题 . 我们目前正在使用提供数据的ASP.NET Web Api将应用程序迁移到Angular 2 .
我已经通过最少的更改移动了代码,并且通过将对datatables库的引用放在承载角度应用程序的index.html页面上的脚本标记中,设法使数据表正常工作 .
然后,我从承载表的组件中运行下面的datatables初始化代码 .
但是每当我尝试用yadcf.init做同样的事情时,我得到:
Uncaught (in promise): TypeError: Cannot read property 'replace' of undefined
它崩溃了 .
ngOnInit(){
this.table = $('#studyList')
.DataTable({
serverSide: true,
responsive: true,
processing: true,
ajax: {........
........
}
.........
});
// runs fine to here and datatables works when the following is commented out
// but crashes as soon as i try and initialise yadcf from
// from within the component as follows.
yadcf.init(this.table,
[
{
column_number: 5,
filter_type: 'multi_select',
select_type: 'select2',
data: [
{ label: 'Included', value: 1 },
{ label: 'Excluded', value: 2 },
{ label: 'Insufficiently Screened', value: 4 }
]
}
]);
// This causes "Uncaught (in promise): TypeError:
// Cannot read property 'replace' of undefined" error
}
真的不想丢失新应用程序中的过滤功能,所以非常感谢您的帮助!
是否有一些关键是让我使用角度2,我错过了?
编辑
看起来错误实际上是由使用jquery 3引起的(见下文) .
2 回答
我意识到错误与角度完全无关(它只是被角度重新抛出)!
我有一个不同版本的 jQuery (原始MVC应用程序中的2.2.4但在我的角应用程序的index.html中引用了3.1.0)
事实证明,yadcf与jQuery 3的搭配并不好 .
具体在
yadcf.init(oTable, options_arg, params)
函数的第一行内,进行以下分配 .这意味着yadcf未初始化,因此稍后调用
yadcf.exFilterColumn(table_arg, col_filter_arr, ajaxSource)
时会抛出错误Cannot read property 'replace' of undefined
.至于yadcf中的jQuery3支持 - 你必须使用yadcf - 0.9.0(或0.8.9的最后一个beta版本,它也在changelog file中说明