let's assume I need to load multiple versions of jQuery in my Angular.js app.
After some test I understood that when I try to load a particular view with the 2nd version of jQuery inside it, my app uses only the first one, so I saw there is a sort of "hack" with $timeout
, but I'm still not able to reproduce it.
My view code is basically this (consider that in index is previously loaded a 2.1.4 version of jQuery):
<script src="http://somepath/jquery-3.1.1.min.js"></script>
<script>
console.log( "2nd loaded jQuery version ($): " + $.fn.jquery );
jq311 = jQuery.noConflict( true );
console.log( "After $.noConflict(true)" );
console.log( "1st loaded jQuery version ($): " + $.fn.jquery);
console.log( "2nd loaded jQuery version (jq311): " + jq311.fn.jquery );
</script>
And my JavaScript is like that:
$scope.$on('$viewContentLoaded', function(event) {
$timeout(function() {
jQuery( document ).ready(function( $ ) {
alert("now loading jQuery");
console.log( " loaded jQuery version ($): " + $.fn.jquery );
});
},0);
});
When alert comes, in the console the following code is shown:
loaded jQuery version ($): 2.1.4
I know I'm messing something in the JavaScript, but I can't figure out what. Any hint?
UPDATE: I now achieved the loading of the 2nd jQuery using [ocLazyLoad][1]
console.log( "1st loaded jQuery version ($): " + $.fn.jquery );
$ocLazyLoad.load('somepath/jquery/jquery-3.1.1.min.js').then(function(response) {
$timeout(function() {
console.log( "2nd loaded jQuery version ($): " + $.fn.jquery );
var jq311 = jQuery.noConflict(true);
console.log( "After jQuery.noConflict(true)" );
console.log( "1st loaded jQuery version ($): " + $.fn.jquery);
console.log( "2nd loaded jQuery version (jq311): " + jq311.fn.jquery );
},0);
});
but I'm still not able to use noConflict
method
Here the console output:
1st loaded jQuery version ($): 2.1.4
2nd loaded jQuery version ($): 3.1.1
After jQuery.noConflict(true)
1st loaded jQuery version ($): 3.1.1
2nd loaded jQuery version (jq311): 3.1.1
Any hint why I'm not able to choose jQuery? [1]: https://oclazyload.readme.io/