天天看点

Angular项目里怎么使用 jQuery 插件

          做项目遇到一个把HTML元素导出pdf的需求,查找资料后找到jQuery.print.js,在一个html页面里测试使用没问题(自己记录的文章)。但是项目使用的是Angular,安装完jquery后可以很方便地使用,但是怎么使用jquery的插件,比如jQuery.print,虽然引入了jquery.js和jQuery.print.js,但是控制台却报错:jquery未定义print方法。。。下面列出了使用Angular框架正确使用jquery及其插件的方式。

1、npm install @types/jquery  --save

2、npm install jquery --save           

    //不能直接安装jquery,否则会报错找不到jQuery的定义,原因如下:

Angular项目里怎么使用 jQuery 插件

3、安装依赖jquery的jquery插件: npm install jQuery.print  --save

        如果通过使用import 'jQuery.print'的方式使用jQuery.print(),这时在使用jquery的时候会报错jquery为定义print方法。

4、解决“jquery插件方法”未定义

        在Angular项目里有个typings.d.ts文件,在该文件里声明jQuery的插件的方法。

Angular项目里怎么使用 jQuery 插件

        最后通过  import * as $ from  'jquery'方便地使用jquery和jquery插件的方法了,不需要"import jquery插件"。