This repository was archived by the owner on Apr 12, 2024. It is now read-only.
Repository navigation
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
ng-jq only works on html tag #11779
Description
I tried the new tag 'ng-jq' to disable trying to use my very old jQuery lib
(not working)
(working)
In my case I tried to improve a small module in a very old Joomla page so changing the layout template is not really a nice way to do it - would be better if I could use ng-jq on the app tag too)
AT least the description stated it not madatory to do it in the tag
tried with: 1.4.0-rc.1
Activity
kentcdodds commentedon Apr 30, 2015
I'm guessing this is your issue. Compare this jsbin (not working) to this jsbin (working). The difference is where angular is being loaded. I'm guessing that you're placing the
angularscript on the page BEFORE the element with theng-jqtag. I'm guessing that the issue is that at the timeangularloads, it will look in the DOM and try to findng-jq. Because that part of the DOM hasn't been loaded yet, angular doesn't find it.So your solution is to make sure that the element with
ng-jqappears BEFORE the script tag that loads angular.Perhaps I'll make a PR to update the docs to point out this issue. Good luck!
docs(ngJq): update to indicate common pitfall
caitp commentedon Apr 30, 2015
That's right. Unfortunately this info needs to be known before the document is ready, so it needs to be an early element
kentcdodds commentedon Apr 30, 2015
Ah, and another alternative would be to simply place the jQuery script AFTER the angular script. You wouldn't need the
ng-jqscript on the page at all for this solution.TheBelgarion commentedon May 1, 2015
Ha, yes that makes sense, was somehow thinking it inits after domready, but guess it need to run earlier for all the gimmicks ..
@kentcdodds I think there was some talk why loading jQuery after angularJS doesnt work in all cases
e.g. some code simple uses
if (!jQuery) {...} else {jQlite}issue relates to #11647 ( just found that now)
thx!
docs(ngJq): update to indicate common pitfall
docs(ngJq): update to indicate common pitfall