如何在继续之前立即加载脚本文件（动态添加）？

Question

我已经在 angular home.component.ts 文件

中加载了如下代码的脚本文件

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

     }

但是这个文件是在创建组件之后加载的。因此，在这种情况下，它不使用该文件。我想在附加文档后加载此文件。如何实现？

Answer 1

您可以return 承诺链式调用

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;
        });    
     }

或者只是将函数传递给 onLoad 以便在加载脚本时调用

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();
     }

如何在继续之前立即加载脚本文件（动态添加）？

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

sleep

script-tag

typescript

angular