Question

在我的项目中，我使用的是jQuery和angular。我已经通过凉亭安装了这些，我使用browserify来加载文件。这似乎工作正常，除了角度似乎使用jqLite。当我试图运行时

angular.element(".workItem").hide();

我收到一条错误，说jqLite不支持查询选择器。我怎样才能绕过这个并使角色使用jQuery？

我想在$上使用angular.element进行测试。

谢谢！

Answer 1

来自docs：

要使用jQuery，只需确保在angular.js文件之前加载它。

因此，在您的index.html文件中，您会想要这样的内容：

<html>
  <head>
    <script src='jquery.js'></script>
    <script src='angular.js'></script>
  </head>
</html>

执行此操作后，angular.element应该可以替代$：

如果jQuery可用，angular.element是jQuery函数的别名。如果jQuery不可用，angular.element会委托给Angular的内置jQuery子集，称为＆＃34; jQuery lite＆＃34;或＆＃34; jqLite。＆＃34;

IE中。 angular.element('.foo')与$('.foo')相同。

Answer 2

要使它与browserify一起使用，您必须要求它：将jquery依赖项添加到bower并在主文件中执行：

require('jquery');
global.jQuery = require('jquery');
global.$ = jQuery;

直到这里，浏览器才能看到它，因为引用仅在凉亭中。所以使用browserify-shim制作胶水：

安装browserify-shim
在您的package.json中，添加：

 "browserify": {
   "transform": [
     "browserify-shim"
   ]
 },
  "browser": {
    "jquery": "./bower_components/jquery/dist/jquery.js"

有关完整信息，请参阅https://github.com/thlorenz/browserify-shim。

Answer 3

要使用Bower，请转到文件 bower.json ，然后将 jquery 放在任何 angular 库之前，将它们放入依赖关系中。

{
  "name": "myadmin",
  "version": "1.0.0",
  "dependencies": {
    "jquery": "~2.1.4",
    "angular-animate": "~1.6.9",
    "angular-cookies": "~1.6.9",
    "angular-touch": "~1.6.9",
    "angular-sanitize": "^1.6.9",
    "angular-messages": "~1.6.9",
    "angular-aria": "~1.6.9",
    "angular-resource": "~1.6.9",
    "angular-ui-router": "~0.4.0",
    "angular-bootstrap": "~2.4.0",
    "angular-toastr": "^2.1.1",
    "animate.css": "~3.4.0",
    "angular": "~1.7.0",
    ...

如何让Angular在jqLite上使用jQuery

3 个答案:

如何让Angular在jqLit​​e上使用jQuery

3 个答案:

如何让Angular在jqLite上使用jQuery