I have to use few third-party scripts in my angular app, till now I have been loading these in my index.html and for the code which make use of these scripts, I have created a service.
Now I want to move these third-party scripts inside service itself, so that,
- I have more control over them as I want to load different versions of these scripts based on the environment they are being executed.
- Also to make my index.html less cluttered.
I can move and load these scripts in the service by loading them by creating script tag on head, my problem is, till the time these scripts are loaded I don't want my service which uses these to execute, as it will result in error.
Is there a way, either in angularjs or just JS, to know when these scripts are loaded and then only execute my code in service?
Or is there a better way of handling this?