title: Not load a script in index.html before angular2 modules are all loaded
body: <p>I'm trying to implement an angular2 app that has a dependency on a 3rd party js library, that is getting included in index.html script tag. Trying to implement the sales force external identity solution as outlined <a href="https://developer.salesforce.com/docs/atlas.en-us.208.0.externalidentityImplGuide.meta/identityImplGuide/external_identity_login_intro.htm" rel="nofollow noreferrer">here</a>.</p>
  
  <p>this script is looking for some meta tags in the page in order to function properly, whether to pop-up as a model or inline form for example. </p>
  
  <p>I'm using the angular platform browser's Meta functionality to set the meta tags in the page, implemented in the constructor of app.component.ts. </p>
  
  <p>This seems to have created a race condition, as in certain situations (typically, when the script exists in the browser cache) it throws alerts that the required meta tags aren't available. </p>
  
  <p>How can I stop the loading of the script in index.html (I've set it with the defer and async keywords btw) to not load until AFTER the app.component has set the meta tags? </p>
  
  <p>app.component.ts</p>
  
  <pre><code>import {Component, OnInit} from '@angular/core';
  import {TodoService} from './providers/todo.service';
  import {Meta} from '@angular/platform-browser';
  import {environment} from '../environments/environment';
  import { isNull } from 'util';
  
  
  declare var SFIDWidget: any;
  declare var SFIDWidget_loginHandler: any;
  declare var SFIDWidget_logoutHandler: any;
  
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css'],
    providers: [TodoService]
  })
  export class AppComponent implements OnInit {
  
    constructor(public meta: Meta) {
  
      //meta tag stuff
  
      //check for meta tags and add if not exists
      if (isNull(this.meta.getTag('name="salesforce-logout-handler"'))) {
        this.meta.addTags(
          [
            {
              name: "salesforce-client-id",
              content: `${environment.clientId}`
            },
            {
              name: "salesforce-community",
              content: `${environment.communityURL}`
            },
            {
              name: "salesforce-redirect-uri",
              content: `${environment.redirectURL}`
            },
            {
              name: "salesforce-mode",
              content: "modal"
            },
            {
              name: "salesforce-forgot-password-enabled",
              content: "true"
            },
            {
              name: "self-register-enabled",
              content: "true"
            },
            {
              name: "salesforce-save-access-token",
              content: "true"
            },
            {
              name: "salesforce-target",
              content: "#salesforce-login"
            },
            {
              name: "salesforce-login-handler",
              content: "onLogin"
            },
            {
              name: "salesforce-logout-handler",
              content: "onLogout"
            }
          ], true);
      } else {
  
        console.log('meta tags exist!');
      }
  
  
    }
  
    ngOnInit() {
  
  
    }
  
    onLogin(identity) {
  
      console.log('fired from the app component');
  
    }
  
  
    onLogout() {
  
      SFIDWidget.init();
    }
  
  
  }
  </code></pre>
  
  <p>index.html</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;Herokudos&lt;/title&gt;
    &lt;base href="/"&gt;
  
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;link rel="icon" type="image/x-icon" href="favicon.ico"&gt;
    &lt;script
      src="https://sdo-134f326f986sdo-134f326f986.force.com/servlet/servlet.loginwidgetcontroller?type=javascript_widget&amp;min=false&amp;cacheMaxAge=0"
      async defer&gt;&lt;/script&gt;
    &lt;link
      href="https://sdo-134f326f986sdo-134f326f986.force.com/servlet/servlet.loginwidgetcontroller?type=css"
      rel="stylesheet" type="text/css"/&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;app-root&gt;Loading...&lt;/app-root&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>