I have an HTL template that contains a handlebars template (<script id="topic-header-base" type="text/x-handlebars-template">).
My problem is that displaying the value of an HTL variable inside a handlebars templates gives me blank. It seems to be the HTL inside the template is ignored.
In my code below: this is what I get on the browser => inside template1 - inside handlebars template - product.year: (product.year is empty/null)
Basically I want to use data-sly-test to hide/show pieces of content/information in my handlebars template.
here's my full code
<sly data-sly-use.make="${'com.myhost.core.impl.view.page.ProductPageHelper'}"></sly>
<h3>ourside of template - year: ${make.product.year}</h3>
<sly data-sly-test="${make.product.year > 2020}"><h3>outside of template - greater than 2020</h3></sly>
<sly data-sly-use.template1="template1.html" data-sly-call="${template1.template @ product=make.product}" data-sly-unwrap></sly>
<div id="template1-target"></div>
<script type="text/javascript">
$( document ).ready(function() {
$("#template1-target").html(Handlebars.compile($("#template1-base").html())());
});
</script>
contents of template1.html
<template data-sly-template.template="${@product}">
<h3>inside template1 - outside handlebars template - product.year: ${product.year}</h3>
<sly data-sly-test="${product.year > 2020}"><h3>inside template1 - outside handlebars template - insert-link-here</h3></sly>
<script id="template1-base" type="text/x-handlebars-template">
<h3>inside template1 - inside handlebars template - product.year: ${product.year}</h3>
<sly data-sly-test="${product.year > 2020}"><h3>inside template1 - inide handlebars template - insert-link-here</h3></sly>
</script>
</template>
