Now.js Framework Documentation
TemplateManager
TemplateManager
Generated from source on 2026-08-21. Descriptions come from JSDoc in the file.
Re-rundocs_scaffoldwhen the code changes; hand edits are lost on regeneration
Source
- File:
Now/js/TemplateManager.js(3985 lines) - Form: object literal (singleton)
Public methods (67)
applyModelBindingDefinition(binding, value)
No description in source
cleanup()
No description in source
cleanupCache()
No description in source
cleanupComponent(componentId)
No description in source
cleanupComponentHandlers(componentId)
No description in source
cleanupElement(element)
No description in source
cleanupElementBindings(element, options = {})
No description in source
cleanupElementScripts(element)
No description in source
cleanupHandlers()
No description in source
cleanupModelListeners(element)
No description in source
cleanupScripts()
Cleanup all active scripts before page navigation Calls cleanup functions if provided by the script
clearCache()
No description in source
cloneDirectiveState(state, mode = 'deep')
No description in source
cloneState(state)
No description in source
getDirectiveContext(binding, context)
No description in source
getDirectiveEvalState(binding, context, options = {})
No description in source
hasOperators(str)
No description in source
async init(options = {})
No description in source
isValidPath(path)
No description in source
isValidUrl(url)
No description in source
async loadFromServer(path)
No description in source
mergeDirectiveContext(previousContext, context)
No description in source
mergeDirectiveState(previousState, nextState)
No description in source
normalizePath(path)
No description in source
onComponentDestroy(component)
No description in source
performCleanup()
No description in source
async processContent(content, path)
No description in source
processDataAttr(el, value, context)
No description in source
processDataBind(el, expression, context)
Process data-bind directive (or data-attr="data:fieldName") for binding complex data to TableManager or LineItemsManager components. Uses ExpressionEvaluator so it supports bracket access and {{}} interpolation — works correctly inside data-for loops. Includes a retry mechanism to wait for the component to be initialized (TableManager / LineItemsManager may initialize asynchronously). Usage: data-bind="items" → state.items data-attr="data:items" → same (backward compatible) data-bind="order.lines" → state.order.lines
processDataChecked(el, expression, context)
No description in source
processDataClass(el, value, context)
No description in source
processDataContainer(el, value, context)
No description in source
processDataDirectives(element, context, options = {})
Apply every data-* directive found in a subtree nested data-component="api" alone · that component renders its own subtree from its own (merged) scope, and painting it here with the outer scope answers its conditions from data that does not describe it — a data-if reading a field the outer response has never heard of resolves to undefined and removes the element for good
processDataFiles(el, expression, context)
Process data-files directive for file inputs. Resolves an expression to obtain existing file data and sets it on the file input element. Uses ExpressionEvaluator so all expression syntax (dot notation, bracket access, mustache interpolation) is supported — exactly the same as data-attr or data-text. Usage: data-files="avatar" → state.avatar data-files="config.csv" → state.config.csv data-files="default_icon[{{lng.value}}]" → state.default_icon['th'] The resolved value must be an array of file objects [{url, name}].
processDataFor(el, value, context)
No description in source
processDataHtml(el, value, context)
No description in source
processDataIf(el, expression, context)
No description in source
processDataModel(el, value, context)
No description in source
processDataOn(el, value, context)
No description in source
processDataOnLoad(element, context)
Process data-on-load directive Works like data-script but uses data-on-load attribute and is intended to run after API/form data has been loaded into a container. The handler receives the normalized data payload (context.state?.data || context.data || context).
processDataOptionsKey(el, expression, context)
Process data-options-key directive for select, multi-select, tags, and text-autocomplete elements. Detects the element type and delegates to the appropriate Factory's populateFromOptions method. The options data is retrieved from context.options (set by FormManager from instance.state.formOptions). Resolves {{}} against context.state/computed (for data-for loop vars), then looks up option arrays by flat key, dot path, or bracket path on options only (e.g. attributeoptions[{{attr.id}}]). Usage: data-options-key="categories" data-options-key="attr{{attr.id}}_options" data-options-key="attribute_options[{{attr.id}}]"
processDataScript(element, context)
Process data-script directive Calls a global function after template processing is complete
processDataStyle(el, value, context)
No description in source
processDataText(el, expression, context)
No description in source
processInterpolation(element, context)
No description in source
processTemplate(element, context)
No description in source
processTemplateContent(element, context)
No description in source
processTemplateString(template, context, container)
No description in source
recordError(error, path)
No description in source
recordPerformance(name, data)
No description in source
registerEventHandler(handlerExpr, context)
No description in source
render(context, container)
No description in source
renderError(error)
No description in source
sanitizeElement(element)
No description in source
sanitizeInlineStyle(styleText)
No description in source
sanitizeStyles(styles)
No description in source
sanitizeUrlAttribute(value)
No description in source
sanitizeUrlValue(value)
Sanitize URL values in CSS to prevent XSS attacks Supports: http://, https://, relative paths, and data:image/* (including base64) Blocks: javascript:, data:text/html, and other dangerous protocols
scheduleI18nUpdate(container)
No description in source
setStateValue(path, value, state)
No description in source
setupPerformanceMonitoring()
No description in source
startCleanupInterval()
No description in source
stopCleanupInterval()
No description in source
syncDirectiveBinding(binding, context, options = {})
No description in source
async validateMarkup(content)
No description in source
async validateRequest(url)
No description in source
valueToString(value)
No description in source
Events
| Event | When Triggered | Detail |
|---|---|---|
template:render |
A component template finished processing | {componentId, timestamp, container} |
template:error |
Loading or processing a template failed | {error, path, timestamp} |
template:performance |
Processing timing report | {name, timestamp} |
template:cleanup |
One component's resources were released | {componentId} |
template:cleanup:all |
Every resource was released | none |
if:updated |
A data-if was re-evaluated |
{element, condition, expression} |
app:cleanup:start |
A scheduled cleanup pass started | {timestamp} |
app:cleanup:end |
The cleanup pass finished | {timestamp} |
Data attributes used
data-attr · data-component-id · data-element · data-files · data-format · data-formatter · data-formatters · data-handler-id · data-on-load · data-options-key · data-parent-context · data-script · data-table
Depends on
ApiComponent · ComponentManager · CoreObserver · ElementManager · ErrorManager · EventManager · EventSystemManager · ExpressionEvaluator · FileElementFactory · I18nManager · LineItemsManager · MultiSelectElementFactory · SelectElementFactory · TableManager · TagsElementFactory · TextElementFactory · Utils