Import Modules Using requireJS Path Mapping
The example below shows how to import two modules in a page.json
using requireJS path mapping.
{
"imports": {
"modules" : {
"converterUtils": {
"path": "ojs/ojconverterutils-i18n"
},
"arrayUtils": {
"path": "faCommon/arrayUtils"
}
}
}
}
- "
converterUtils
" specifies a path to a JET module using the implicit requireJS mapping ('ojs') that is set up for JET modules in VB. - "
arrayUtils
", on the other hand, uses a requireJS path 'faCommon' that is a requireJS path mapping defined in the application metadata.
Each module defined in the section is available through an un-scoped "$imports
" built-in variable.
The built-in "$imports
" context property is un-scoped and limited to the current container to avoid performance issues and module conflicts at different context (for example, $page
, $flow
, $application
).
<div>
<oj-bind-text
value="[['Last Updated on - ' + $imports.converterUtils.IntlConverterUtils.dateToLocalIso(new Date())]]">
</oj-bind-text>
</div>
In a page.json action chain, the assignVariablesAction
uses the external module imported as "arrayUtils
", to call a filter method, as shown here:
{
"removeTab": {
"module": "vb/action/builtin/assignVariablesAction",
"parameters": {
"$page.variables.switcherArray": {
"module": "{{ $imports.arrayUtils }}",
"functionName": "filter",
"params": [
{
"array": "{{ $page.variables.switcherArray }}",
"callback": "{{ function (p) { return p.id !== $variables.itemToRemove } }}"
}
]
}
}
}
}
where the arrayUtils
method 'filter' might look like this:
class ArrayUtils {
/**
* Returns a new array with all elements that pass the test implemented by the provided function.
* @param helper assignment helper
* @param defaultValue the default value of the variable
* @param {Object} params properties are
* @param {Array} params.array - the array being filtered
* @params {Function} params.callback - function used as callback to filter values.
* @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
* @return {Array} filtered array or the array1 if args invalid
*/
static filter(helper, defaultValue, params) {
const array1 = params.array1;
const callback = params.callback;
if (Array.isArray(array1) && callback && typeof callback === 'function') {
return array1.filter(callback);
}
console.warn('invalid params provided for the filter method', params);
return array1;
}
}