Angular JS - 添加一个 jquery 插件到 jQlite

Question

我需要在 $element 上做一些 dom 遍历，但是 jQuery 或 jQlite 不能开箱即用，所以我需要使用 jQuery 名为 closestChild 的插件。

https://github.com/lolmaus/jquery.closestchild/blob/master/jquery.closestchild.js

我已经使用 bower 安装，我试图在我的脚本标签中 angular.min.js 之后加载它，但仍然出现以下错误。

Uncaught TypeError: Cannot read property 'fn' of undefined

那么，我假设 Angular 附带的 jQlite 不会默认为您提供 $ 以供使用？或者我只是按错误的顺序做事？

Answer 1

jQlite 不支持 jQuery 插件。实际上，它是一个轻量级的选择器工具——而不是一个支持扩展的重量级工具，比如 jQuery。

你有两个选择：

使用 JavaScript 实现功能 ( element.getElementBySelector('foo)[0] ).
在您的项目中包含 jQuery。

我个人会使用选项 1。

Answer 2

不，angular.element (jqLite) 不导出 $ 全局变量。所以你不能在没有 jQuery 的情况下使用 Angular 的任何 jQuery 插件。在某些情况下，如果您在包含插件之前手动创建 $ 引用，就可以解决它，就像它是 jQuery 一样。例如像这样：

<script src="path-to-angular.js"></script>
<script>
window.$ = window.jQuery = angular.element;
window.$.fn = window.$.prototype;
</script>
<script src="path-to-jquery.plugin.js"></script>

但是，在你的情况下它不会工作，因为感兴趣的插件使用 $.fn.filter 方法，jqLite 没有实现。这是所有可用的列表 angular.element methods.

您可以自己实现其中一些并在插件之前包含..

但是，如果您想使用 jQuery 插件，我建议实际使用 jQuery。

Angular JS - 添加一个 jquery 插件到 jQlite

Angular JS - Adding a jquery plugin to jQlite

javascript

jquery

angularjs

jqlite