Newer Version Available
ltng:require
Loads scripts and stylesheets while maintaining dependency order. The styles are loaded in the order that they are listed. The styles only load once if they are specified in multiple <ltng:require> tags in the same component or across different components.
ltng:require enables you to load external CSS and JavaScript libraries after you upload them as static resources.
1<ltng:require scripts="/resource/jsLibOne,/resource/jsLibTwo"
2 styles="/resource/cssOne,/resource/cssTwo"
3 afterScriptsLoaded="{!c.afterScriptsLoaded}"/>The comma-separated lists of resources are loaded in the order that they are entered in the scripts and styles attributes. The afterScriptsLoaded action in the client-side controller is called after the scripts are loaded. To ensure encapsulation and reusability, add the <ltng:require> tag to every .cmp or .app resource that uses the CSS or JavaScript library.
The resources only load once if they are specified in multiple <ltng:require> tags in the same component or across different components.
Attributes
| Attribute Name | Attribute Type | Description | Required? |
|---|---|---|---|
| body | Component[] | The body of the component. In markup, this is everything in the body of the tag. | |
| scripts | String[] | The set of scripts in dependency order that will be loaded. | |
| styles | String[] | The set of style sheets in dependency order that will be loaded. |
Events
| Event Name | Event Type | Description |
|---|---|---|
| afterScriptsLoaded | COMPONENT | Fired when ltng:require has loaded all scripts listed in ltng:require.scripts |
| beforeLoadingResources | COMPONENT | Fired before ltng:require attempts to load any requested resources |