1

I have some animation libraries that are loaded at the end of the page. Problem is they are not binding to the html that is populated via the directives.

Is there a way to load the scripts after the view has been completely rendered (including the directives)?

Improve this question

1 Answer 1

Reset to default
1

When a script is placed inside angular app element (ng-app on html not body or <script> inside body), <script ng-src="...> will force first bootstrap angular and then only put scripts for download. But mind the fact that if you have multiple libs they will be downloaded in parallel, and order in html won't be tracked in contrary to scripts directly loaded from head at page load.

Alternatively you can add ng-if="doLoadExternalScripts", for example, and specify a truthy value to this variablle when you consider it is right time, for example if your directives are not rendered on init of app

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

I used <script ng-src...> as advised and it works great, thank you. You mentioned directives being loaded in parallel and therefore the order of the HTML won't determine the order of the JS. If that is the case, is there a way to use the priority in Angular to designate the order of the javascript files if they do depend on the order?
So far I haven't found a neat way to do that. In most cases you can replace plain link with bower/npm module if library is popular enough. In such there won't be any problems with dependencies

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.