How to dynamically add scripts tag at each Sub-domain level through single angular application?

Question

I have tired some of DOM operation like,

document.createElement

document.write

The document.createElement way requires a standard script structure . But in my case it can be either a java script function or script link.

The document.write operation overwrite the entire script when used inside app.component and only inside the app.component I have the dynamic data at Sub-domain level.

Didn’t work as expected .

Answer 1

You're talking about the same application on different sub-domains so it seems like you're looking at deploying an application to different environments with different scripts depending on which environment.

I recommend using the environment files in \src\environments\. You can set the scripts like this:

environment.ts:

export const environment = {
  version: require('../../custom-script-for-environment1.json')
};

environment.subdomain.ts:

export const environment = {
  version: require('../../custom-script-for-environment2.json')
};

and then import it where needed:

import { environment } from '../environments/environment';

Read more about environments in this Angular blog:

https://alligator.io/angular/environment-variables/