對於Angular 4，使用angular-datatables時DataTable不是函數TypeError

Question

我在代碼中使用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 

任何想法？

UPDATE：這是我的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/*" 
     ] 
    } 
    } 
} 

Answer 1

嗨，你肯定_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); 
      }); 
     }); 
    }); 
}; 

希望它可以幫助你！