question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

If, else, for and arguments

See original GitHub issue

Is your feature request related to a problem? Please describe.

I’m currently working on a project with a friend and we have started creating some email template for different use cases. Some of this templates are very flexible to contain things like dynamic lists that are filled by the user input. So we came up with the problem, that MJML has no tags or something like that to loop through a set of arrays items or even render a simple string in a tag. We program our API in python and using jinja2 templating, therefore we need to pass the pre-rendered jinja2 template with jinja2 if else clauses and variables to MJML CLI. This is a step we would like to avoid.

Describe the solution you’d like

It would be nice if MJML supports something that allows passing arguments to the template that will be rendered. e.g.:

the {{}} Syntax is a syntax from Jinja2, Twig and others use this too and I think its pretty innovative as it differs from HTML

<mjml lang="de">
<!-- OR -->
<mjml lang="lang.short"> <!-- would check if its a available variable-->
  <mj-head>
    <mj-title><mj-var name="title"/></mj-title>
    <!-- OR -->
    <mj-preview>{{ title }}</mj-preview>
  </mj-head>
  <mj-body background-color="#FFFFFF" width="600px">

    <mj-section full-width="full-width" background-color="#26292c">
      {% if menu | length > 0 %}
      <!-- OR -->
      <mj-if rule="menu.length > 0">
      <mj-column width="70%" vertical-align="middle">
        <mj-text align="right">
          {% for item in menu %}
          <!-- OR -->
          <mj-for array="menu.length > 0">
            <a href="{{ item.link }}">{{ item.text }}</a>
            <!-- OR -->
            <mj-link href="item.link"><mj-var name="item.text"/></mj-link>
          {% endfor %}
          <!-- OR -->
          </mj-for>
        </mj-text>
      </mj-column>
      {% endif %}
      <!-- or -->
      </mj-if>
    </mj-section>

  </mj-body>
</mjml>

Describe alternatives you’ve considered

Currently, as I have written above, we use Jinja2 (flask) to prerender the templates and pass it to MJML CLI. Additionally a Python renderer would be awesome too.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:13 (4 by maintainers)

github_iconTop GitHub Comments

6reactions
iRyusacommented, Sep 1, 2021

You can just wrap them into mj-raw instead of comment blocks too

6reactions
connecteevcommented, Nov 8, 2019

+1 on this…a very barebones if-else conditional (like vue.js’s v-if and v-else) would be really great.

Read more comments on GitHub >

github_iconTop Results From Across the Web

4. More Control Flow Tools — Python 3.11.1 documentation
The keyword ' elif ' is short for 'else if', and is useful to avoid ... we will see more functions that return...
Read more >
Chapter Eleven: If–Then Arguments - Publishing Services
If –then arguments , also known as conditional arguments or hypothetical syllogisms, are the workhorses of deductive logic. They make up a loosely...
Read more >
if...else - JavaScript - MDN Web Docs - Mozilla
The if...else statement executes a statement if a specified condition is truthy. If the condition is falsy, another statement in the optional  ......
Read more >
Is passing an argument the best solution for if/else decisions
I am currently sending a unique argument via a shared parameter along with dog() and cat() to channel each function through different paths...
Read more >
7.2. More advanced if usage
The exit statement takes an optional argument. This argument is the integer exit status code, which is passed back to the parent and...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found