Ошибка в Rowspan при переборе с помощью ручек - PullRequest
Новая
       9

Ошибка в Rowspan при переборе с помощью ручек

0 голосов
/ 06 сентября 2018

У меня есть цикл, который охватывает динамические данные, запрашиваемые через руль. 

<tr class = "">
             <td class = "fw-900" colspan = "2"> Salary </ td>
             <td class = "fw-900" colspan = "2"> Duties </ td>
             <td class = "fw-900" colspan = "1"> Name </ td>
         </ tr>

{{#each this.peoples}}
             <tr>
                 <td class = "text-uppercase" colspan = "2"> {{this.salary}} </ td>
                 <td class = "text-uppercase" colspan = "2"> duties </ td>
                 <td class = "text-uppercase"> {{this.name}} </ td>
                 <td class = "text-uppercase text-center total" rowspan = "{{../ members.length}}" colspan = "" width = "15%"> {{../ members.length}} </ td>
             </ tr>
{{/ each}}

Когда он отображает итоговое значение, я хотел бы сделать интервал между строками, но так как взаимодействие между строками строк также охватывает эту строку, получается, что он будет отображать один столбец для каждой отображаемой строки.

Как правильно выполнить эту стратегию?

1 Ответ

0 голосов
/ 06 сентября 2018

Если я правильно понимаю вашу проблему, я столкнулся с этой проблемой сам. Я решил эту проблему, получив индекс текущей итерации каждого, а затем с помощью помощника, чтобы проверить, был ли индекс 0, - первая итерация. Если это так, то он визуализирует строку с тд.

JS 

Handlebars.registerHelper('conditionalHelper', function(lValue, rValue, options) {
  if (lValue == rValue) {
    return options.fn(this);
  }
  return options.inverse(this);
});

Template 

{{#each this.peoples as | person personKey|}}
  {{#conditionalHelper personKey 0}}
    <td class = "text-uppercase text-center total" rowspan = "{{../ person.members.length}}" colspan = "" width = "15%"> {{../ person.members.length}} </ td>
  {{/conditionalHelper}}
{{/each}}

Более подробную информацию о функциональности индекса можно найти в документации здесь .

...