jQuery如何在Angular2项目中使用

这期内容当中小编将会给大家带来有关jQuery如何在Angular2项目中使用，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。

方法一

当然是使用最正规军了，用命令安装jQuery的声明文件。

npm install -D @types/jquery

以及使用

import * as $ from 'jquery';

$('body').addClass('');

完美的智能提示，如果你在VS CODE下的话。

方法二

对于一些并未提供 .d.ts 声明文件的类库，我们怎么办？那当然只能自己写了。

什么？自己写？很困难吧！很复杂吧！

没那么一回事，声明文件其实是对一些类库接口的描述，以下是我截取一段jQuery声明文件的部分代码

interface JQueryStatic {
 /**
  * 去掉字符串首尾空格
  *
  * @param str 字符串
  * @see {@link https://api.jquery.com/jQuery.trim/}
  */
 trim(str: string): string;
}

declare var $: JQueryStatic;

我还特意译成中文，这里的含量很少，最关键的就是 declare 它就是把一个变量 $ 定义成类型 JQueryStatic （还是个接口）。

这样，TS编译器在遇到 $ 时会去找该类型，并且你的代码里面不能出现 $.time1() 之类的，因为你的接口，只有一个 $.trim() 。

等等，jQuery几十个接口，我都要这么写吗？

NO！！！当然不是，除非你想写一个又漂亮、又好看、又是中文、又是完美智能提示的声明文件的话。

否则，你那就拿 any 类型吧，TA就是万能货。你不需要写一个很复杂的声明文件，只需要：

declare var $: any;

上述就是小编为大家分享的jQuery如何在Angular2项目中使用了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注亿速云行业资讯频道。