For example, native Magento theme-frontend-blank\web\js\navigation-menu.js has such code:
$.widget('mage.navigationMenu', {
options: {
...
collapsableDropdownTemplate:
'<script type="text/x-magento-template">' +
'<li class="level0 level-top more parent">' +
'<div class="submenu">' +
'<ul><%= elems %></ul>' +
'</div>' +
'</li>' +
'</script>'
And then they do
this.collapsableDropdown = $(
mageTemplate(
this.options.collapsableDropdownTemplate,
{elems: this.elemsToCollapseClone}
)
);
Is it possible to do something like this
collapsableDropdownTemplate: getTemplate(some_relative_path_to_template) ?
instead of
collapsableDropdownTemplate:
'<script type="text/x-magento-template">' +
'<li class="level0 level-top more parent">' +
'<div class="submenu">' +
'<ul><%= elems %></ul>' +
'</div>' +
'</li>' +
'</script>'
My template is a little bit bigger and I want to allow frontend developers to modify it.
Best Answer
Yes, we can do it.
1) Template selector: the script and template are in one place.
Using
text/x-magento-template
vendor/magento/module-shipping/view/adminhtml/templates/order/tracking.phtml
2) Require text (I think you need it)
vendor/magento/module-ui/view/base/web/js/grid/columns/thumbnail.js
Define it:
text!Magento_Ui/templates/grid/cells/thumbnail/preview.html
Use it
See here: vendor/magento/module-ui/view/base/web/js/modal/modal.js