我们如何在 angular 5 项目中使用 jquery 插件，如 jquery.tabulator

Question

[在此处输入图片描述][1]

[在此处输入图片描述][2]

如果我想将 jQuery 插件如 jquery.tabulator 添加到 angular 项目，那么我们该怎么做呢？因为我确实在 angula.cli.json 文件 "scripts" 中添加了插件 js 代码：[

    "assets/libraries/tabulator/tabulator-min.js",

但是当我使用制表符初始化函数对其进行初始化时却出现错误。属性 'tabulator' 在类型 'JQuery

上不存在

Answer 1

安装jquery、jquery-ui和jquery.tabulator

npm install jquery jquery-ui-dist jquery.tabulator --save
为 jquery 安装打字，由打字稿使用，保存到开发依赖项

npm install @types/jquery --save-dev
在 tsconfig.app.json 文件中添加 jquery
```
...
"types": [
  "jquery"
]
... 
```

包括jquery和.angular-cli.json

中的插件脚本


...
"styles": [
  "styles.css",
  "../node_modules/jquery.tabulator/dist/css/tabulator.min.css"
],
"scripts": [
  "../node_modules/jquery/dist/jquery.min.js",
  "../node_modules/jquery-ui-dist/jquery-ui.min.js",
  "../node_modules/jquery.tabulator/dist/js/tabulator.min.js"
]
...

在本地类型声明文件中添加接口 JQuery typings.d.ts 并声明插件函数
```
interface JQuery {
  tabulator(options1?: any, options2?:any): any;
}
```
照常使用制表符

这里有一个参考 link, Angular 5 — using jquery plugins

我们如何在 angular 5 项目中使用 jquery 插件，如 jquery.tabulator

How can we use jquery plugin like jquery.tabulator in angular 5 project

jquery

jquery-plugins

angular