NgxDynamicScriptLoader
Small Angular library to dynamically load and inject remote JS scripts into the DOM on-demand.
Install
Using yarn:
yarn add @letterflow/ngx-dynamic-script-loader
Using npm:
npm install --save @letterflow/ngx-dynamic-script-loader
Usage
Using the library with default configuration:
import {NgxDynamicScriptLoaderModule} from '@letterflow/ngx-dynamic-script-loader';
@NgModule({
imports: [..., NgxDynamicScriptLoaderModule]
})
export class ExampleModule {}
Using the library with custom configuration:
import {NgxDynamicScriptLoaderModule} from '@letterflow/ngx-dynamic-script-loader';
@NgModule({
imports: [
...,
NgxDynamicScriptLoaderModule.withConfig({
async: false,
skipError: false,
})
]
})
export class ExampleModule {}
NgxDynamicScriptLoaderConfig
InjectionToken:
Providing configuration using import {
NgxDynamicScriptLoaderModule,
NgxDynamicScriptLoaderConfig,
} from "@letterflow/ngx-dynamic-script-loader";
@NgModule({
imports: [NgxDynamicScriptLoaderModule],
providers: [
{
provide: NgxDynamicScriptLoaderConfig,
useValue: {
async: false,
skipAbort: false,
skipError: false,
onLoad(script) {
console.log(script);
},
},
},
],
})
export class ExampleFeatureModule {}
Configuration
When calling NgxDynamicScriptLoader#loadScript
, configuration provided in the methods argument,
will be merged with the current value provided by the NgxDynamicScriptLoaderConfig
InjectionToken.
All callbacks default to a noop
function.
Here is a list of possible configuration fields in NgxDynamicScripLoaderConfig
:
-
async: boolean
Value to use for the async attribute in the injected HTMLScriptElement.
Default:
true
. -
skipAbort: boolean
Whether to throw an error when the
onabort
event fires on the HTMLScriptElement.Default:
true
. -
skipError: boolean
Whether to throw an error when the
onerror
event fires on the HTMLScriptElement. Note: When loading a list of scripts and this field is set to true, all subsequent scripts will not be loaded.Default:
true
. -
onLoad: (reason) => void
Callback that fires when the
onload
event occures.Default:
noop
. -
onAbort: (reason) => void
Callback that fires when the
onabort
event occures.Default:
noop
. -
onError: (reason) => void
Callback that fires when the
onerror
event occures.Default:
noop
.