How to load a script for a specific route in angular 4

Question

I have to load a script that calculates the analytics on a specific route in angular 4. But for other routes the script should not get loaded.

I tried adding the script in index.html but the script will be loaded for all the routes. Any workaround for this?

below is the script

(function(a,b,c,d,e,f){
    a.hj=a.hj||function(){(a.hj.q=a.hj.q||[]).push(arguments)};
    a._hjSettings={hjid:xx,hjsv:xxx};
    e=b.getElementsByTagName('head')[0];
    f=b.createElement('script');f.async=1;
    f.src=t+a._hjSettings.hjid+d+a._hjSettings.hjsv;
    e.appendChild(f);
})(window,document,'https://xx.xx.com/c/xx-','.js?sv=');

Pushprajsinh Chudasama · Accepted Answer · 2019-11-01 09:47:14Z

1

If you add it in index.html then the script will be loaded in all components, and this is not your need. So you can try loading the script from the ts file of the component in which you want to load the script. So in the ts file, you can do it as follow.

System.import('https://xx.xx.com/c/xx-','.js?sv='); //or below one
require('https://xx.xx.com/c/xx-','.js?sv=');

Reference: https://stackoverflow.com/a/41402204/10971575

answered Nov 1, 2019 at 9:47

Pushprajsinh Chudasama

7,9994 gold badges23 silver badges48 bronze badges

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

Collectives™ on Stack Overflow

How to load a script for a specific route in angular 4

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related