Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to force angular to use jqlite or manually reference the jquery object

I'm stuck with an incompatible version of jQuery in my Angular app, I can't upgrade jQuery but can load the latest jQuery version side by side using the noConflict method but I cant seem to find a way to force Angular.js to use the newer jQuery version. Is there such a method available?

Flow:

<head>
    <script src="jQuery 1.3.2">
    <script src="old jquery code">
</head>

<body>
    …

    <script src="jQuery 1.10.2"/>
        <script>
            var newjquery = jQuery.noConflict();
        </script>

        <script src="angular.js"/>

        <script>
            // angular code
        </script>
</body>
like image 242
Casper Deseyne Avatar asked Aug 21 '13 12:08

Casper Deseyne


People also ask

How do I access Jqlite?

Accessing jQLite or jQuery with AngularJS jQuery lite or the full jQuery library if available, can be accessed via the AngularJS code by using the element() function in AngularJS. Basically, angular. element() is an alias for the jQuery function i.e.

Why jQuery is not used in Angular?

in fact you should include it before the angular scripts, so angular will use jQuery instead of its jqlite (jQuery subset). the main disadvantage of adding jQuery is the size of the library. the angular team recommends you avoid use jqlite or jQuery in angular controllers, you should use angular directives instead.

What is Angular Jqlite?

jqLite is a tiny, API-compatible subset of jQuery that allows AngularJS to manipulate the DOM in a cross-browser compatible way. jqLite implements only the most commonly needed functionality with the goal of having a very small footprint. To use jQuery , simply ensure it is loaded before the angular. js file.


2 Answers

From the docs:

Does Angular use the jQuery library?

Yes, Angular can use jQuery if it's present in your app when the application is being bootstrapped. If jQuery is not present in your script path, Angular falls back to its own implementation of the subset of jQuery that we call jQLite.

Try to change the position in which you import the scripts:

  • new jquery
  • angular
  • older jquery

I am not sure it would work, but from my understanding Angular should use the already present jQuery.

like image 173
fusio Avatar answered Nov 14 '22 23:11

fusio


you can use the new directive ng-jq with angular 1.4.x to set the Version of switch to jQLite (angular internal jQuery)

like image 21
TheBelgarion Avatar answered Nov 14 '22 22:11

TheBelgarion