Use parent $idx in a condtional dust.js statement

Question

I have a table represented in a javascript (JSon) object. I use it with Dust to populate a table.

Every even row should have data-editable="true" and every odd one should have data-editable="false"

Here's what I tried:

                {#rows}
                <tr>
                    {#rows.values}
                    <td data-header="{header}" data-editable="{#rows}{@@math key=$idx method=" mod" operand=2}
                        {@@eq value=0}
                        true
                        {:else}
                        false
                        { />eq}
                    {/math}{/rows}">
                        {value}
                    </td>
                    {/rows.values}
                </tr>
                {/rows}

But it doesn't work.

The javascript object looks like this:

    var data = {
        'headers': ['a', 'b', 'c']
        , 'rows': [
            {
                'values': [
                    { 'header': 'a', 'value': '1' }
                    , { 'header': 'b', 'value': '2' }
                    , { 'header' : 'c', 'value' : '3' }
                ]
            }
            , { 'values': [
                    { 'header': 'a', 'value': '4' }
                    , { 'header': 'b', 'value': '5' }
                    , { 'header' : 'c', 'value' : '6' }
                ]
            }
            , {
                'values': [
                    { 'header': 'a', 'value': '1' }
                    , { 'header': 'b', 'value': '2' }
                    , { 'header': 'c', 'value': '3' }
                ]
            }
            , {
                'values': [
                    { 'header': 'Prénom', 'value': 'Roger' }
                    , { 'header': 'b', 'value': '2' }
                    , { 'header': 'c', 'value': '3' }
                ]
            }
        ]
    }

NOTE: @@ is a ASP.Net escaped @

Answer 1

You can pass variables into a Dust section to scope them to that section. So the solution is to pass along the parent's $idx so that you can use it in a nested section.

This code is tested to work.

{#rows}
      <tr>
          {#.values rowIndex=$idx} {! Here I am passing "rowIndex" into this section !}
          <td data-header="{header}" data-editable="{@math key=rowIndex method="mod" operand=2}{@eq value=0}true{:else}false{/eq}{/math}">
              {value}
          </td>
          {/.values}
      </tr>
{/rows}