Can't seem to get mustache part to render

Help
1

Enonic version: 6.15.2
OS: Mac

I’m trying to use mustache for my page and parts, but I can’t seem to get the parts to render outside of the content studio. I can see the part when I add it to the page, but then it just doesn’t show up in preview or when I go back and edit the page. I can see the json in the content viewer.

My page js file has mainRegion in the model:

const mainRegion = isFragment ? null : content.page.regions.main;

My page html file:

<!-- Main body -->
<!--/* Render any components added to this region - except for Fragments. */-->
{{^isFragment}}
    <div data-portal-region="main">
        {{#mainRegion}}
            {{#components}}
                <div data-portal-component="{{path}}"></div>
            {{/components}}
        {{/mainRegion}}
    </div>
{{/isFragment}}
<!--/* Render Fragments (single view, supported with mappings in site.xml) */-->
{{#isFragment}}
    <div data-portal-component="fragment"></div>
{{/isFragment}}

What I see in the browser, note that it does render the part path:

<div data-portal-region="main">
	    <div data-portal-component="main/0"></div>
</div>

Everything is Thymleaf. Are there any mustache examples out there?

2

Hi Michael,

But do you run your parameters (your model) through the library’s render method before returning it as the body property? Could I see more of you’re JS-code, it would help.

3

Both the page and the part are using require(’/lib/xp/mustache’) – and

const body = libs.mustache.render(view, model);
return { body };

I do see the mustache working for the page view and all the model parameters are rendering there as expected, but it just won’t render the part except when I first drop it into the main region. Once I save the page then the part is gone and it doesn’t show in preview and I can’t add any more parts to the region.

I made a new page component with thymeleaf and it’s working ok. I see the part that uses mustache as expected. So that narrows the problem down to the mustache page where it’s supposed to render part components.

Do you have any working examples of a mustache page with a mustache part? I suspect there is a bug that has gone unnoticed since nobody uses mustache. Or else there is something wrong with this markup:

<!-- Main body -->
<!--/* Render any components added to this region - except for Fragments. */-->
{{^isFragment}}
    <div data-portal-region="main">
        {{#mainRegion}}
            {{#components}}
                <div data-portal-component="{{path}}"></div>
            {{/components}}
        {{/mainRegion}}
    </div>
{{/isFragment}}
<!--/* Render Fragments (single view, supported with mappings in site.xml) */-->
{{#isFragment}}
    <div data-portal-component="fragment"></div>
{{/isFragment}}
4

Hi Michael

Did you get it to work? I just tried rendering a very simple part in the Features app with Mustache and it worked fine. Are you sure there are no issues in the controller code?

5

Hi Michael

The div with data-portal-component attribute is processed by Thymeleaf.

To do the same with Mustache try replacing this line:

<div data-portal-component="{{path}}"></div>

with this:

<!--#COMPONENT {{path}} -->

The line with the HTML comment tag is actually what XP rendering engine is looking for.
When you use Thymeleaf the div is first transformed into the HTML comment by a Thymeleaf extension in XP, and then the rendering engine is inserting the component in place of the comment tag.

3 Likes
6

Yes, that was the problem. I didn’t see that in the documentation. Thanks!

1 Like