Skip to main content

How to load the script file immediately (dynamically added) before continue?

 you can return a promise to chain calls

export class HomeComponent {
    constructor() {
        this.loadDynmicallyScript()
        .then(() => {
          this.doSomethingWhenScriptIsLoaded();
        });
    } 
     public loadDynmicallyScript():Promise {
        var script = document.createElement('script');
        script.src = "../node_modules/xxxxxx/i18n/xx.min.js";
        script.async =false;
        document.head.appendChild(script);
        return Promise((resolve, reject) => {
          script.onload = resolve;
        });    
     }

or just pass a function to the onLoad to be called when the script was loaded

export class HomeComponent {
    constructor() {
        this.loadDynmicallyScript()
    } 
     public loadDynmicallyScript():Promise {
        var script = document.createElement('script');
        script.src = "../node_modules/xxxxxx/i18n/xx.min.js";
        script.async =false;
        document.head.appendChild(script);
        script.onload = () => this.doSomethingWhenScriptIsLoaded();
     }


Another one

loadAPI: Promise<any>;

constructor() {        
    this.loadAPI = new Promise((resolve) => {
        this.loadScript();
        resolve(true);
    });
}

public loadScript() {        
    var isFound = false;
    var scripts = document.getElementsByTagName("script")
    for (var i = 0; i < scripts.length; ++i) {
        if (scripts[i].getAttribute('src') != null && scripts[i].getAttribute('src').includes("loader")) {
            isFound = true;
        }
    }

    if (!isFound) {
        var dynamicScripts = ["https://widgets.skyscanner.net/widget-server/js/loader.js"];

        for (var i = 0; i < dynamicScripts.length; i++) {
            let node = document.createElement('script');
            node.src = dynamicScripts [i];
            node.type = 'text/javascript';
            node.async = false;
            node.charset = 'utf-8';
            document.getElementsByTagName('head')[0].appendChild(node);
        }

    }
}

Comments

Popular posts from this blog

Cannot access a disposed object. A common cause of this error is disposing a context that was

  Cannot access a disposed object. A common cause of this error is disposing a context that was resolved from dependency injection and then later trying to use the same context instance elsewhere in your application. This may occur if you are calling Dispose() on the context, or wrapping the context in a using statement. If you are using dependency injection, you should let the dependency injection container take care of disposing context instances. Object name: 'PropertyContext'.  public class CustomerHub : Hub     {         public readonly ICustomerService _customerService;         private readonly IServiceScopeFactory _serviceScopeFactory;         public CustomerHub(ICustomerService service, IServiceScopeFactory serviceScopeFactory)         {             _customerService = service;             _serviceScopeFactory = serviceSco...

Limit Upload File Type Extensions ASP.NET MVC 5

  //-----------------------------------------------------------------------    // <copyright file="AllowExtensionsAttribute.cs" company="None">    //     Copyright (c) Allow to distribute this code and utilize this code for personal or commercial purpose.    // </copyright>    // <author>Asma Khalid</author>    //-----------------------------------------------------------------------       namespace  ImgExtLimit.Helper_Code.Common   {        using  System;        using  System.Collections.Generic;        using  System.ComponentModel.DataAnnotations;        using  System.Linq;      ...