在为Angular 4使用Angular数据表时，DataTable不是函数TypeError
在为Angular 4使用Angular数据表时，DataTable不是函数TypeError
提问于 2017-10-20 18:38:19
在我的代码中使用angular-datatables时，我得到了TypeError。
ERROR TypeError: $(...).DataTable is not a function
at angular-datatables.directive.js:38 指令中的代码是：
DataTableDirective.prototype.displayTable = function () {
var _this = this;
this.dtInstance = new Promise(function (resolve, reject) {
Promise.resolve(_this.dtOptions).then(function (dtOptions) {
// Using setTimeout as a "hack" to be "part" of NgZone
setTimeout(function () {
//Error in this line
var dt = $(_this.el.nativeElement).DataTable(dtOptions);
resolve(dt);
});
});
});
};这里的问题是什么？我通过以下方式安装库和依赖项：
npm install jquery --save
npm install datatables.net --save
npm install datatables.net-dt --save
npm install angular-datatables --save
npm install @types/jquery --save-dev
npm install @types/datatables.net --save-dev有什么想法吗？
更新:这是我的tsconfig.app.json：
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"baseUrl": "./",
"module": "es2015",
"allowSyntheticDefaultImports": true
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]}
和tsconfig.json：
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
],
"allowSyntheticDefaultImports": true,
"paths": {
"@angular/*": [
"../node_modules/@angular/*"
]
}
}
}回答 3
Stack Overflow用户
发布于 2017-10-20 18:45:04
您好，您确定组件的_this设置正确吗？你有没有尝试过这样的东西：
DataTableDirective.prototype.displayTable = () => {
var _this = this;
this.dtInstance = new Promise(function (resolve, reject) {
Promise.resolve(_this.dtOptions).then(function (dtOptions) {
// Using setTimeout as a "hack" to be "part" of NgZone
setTimeout(function () {
//Error in this line
var dt = $(_this.el.nativeElement).DataTable(dtOptions);
resolve(dt);
});
});
});
};希望能对你有所帮助！
Stack Overflow用户
发布于 2018-07-15 21:05:26
npm install jquery --save
npm install datatables.net --save
npm install datatables.net-dt --save
npm install angular-datatables --save
npm install @types/jquery --save-dev
npm install @types/datatables.net --save-dev然后
在angular.json中添加
enter code here
{
"projects": {
"your-app-name": {
"architect": {
"build": {
"options": {
"styles": [
"node_modules/datatables.net-dt/css/jquery.dataTables.css"========>*
],
"scripts": [
"node_modules/jquery/dist/jquery.js",==============================>*
"node_modules/datatables.net/js/jquery.dataTables.js"==============>*
],使用cmd重启
Stack Overflow用户
发布于 2020-07-14 15:56:45
我把它们都放在angular.json中解决了这个问题
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/datatables.net/js/jquery.dataTables.js"
]页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46847380
复制相关文章
相似问题
腾讯云开发者
