Использование однострочного цикла для генерации HTML-классов в представлении Rails - PullRequest
Новая
       8

Использование однострочного цикла для генерации HTML-классов в представлении Rails

0 голосов
/ 17 января 2019

У меня есть хеш в формате: 

@meals = [
        {
            name: 'Roasted Chicken A La Ratatouille',
            description: '',
            tags: ['chicken'],
            type: ['program'],
            image_url: ''
        },
        {
            name: 'Turkey Nuggets with Buffalo Cauliflower & Spinach',
            description: '',
            tags: ['turkey'],
            type: ['program', 'veggies'],
            image_url: ''
        }
     ]

и я хотел бы иметь возможность распаковать еду type как имена классов для элемента: 

<% meals.shuffle.each do |meal| %>

  <!-- Line in question --> 
  <div class="item col-3 p-2 a b <%= meal[:type].each {|t| t } %>">
  <!-- End line in question --> 

    <div class="card">
      <img class="card-img-top" src="<%= meal[:image_url] %>">
      <div class="card-body">
        <h5 class="card-title font-medium"><%= meal[:name] %></h5>
      </div>
      <div class="card-footer text-muted justify-content-center row">
        <% meal[:tags].each do |tag| %>
          <span style="margin: 2px;" class="badge bg-info-gradiant pointer"><%= tag %></span>
        <% end -%>
      </div>
    </div>
  </div>
<% end %>

Но когда представление отображается, оно отображается как: 

<div class="item col-3 p-2 a b ["program"]" style="position: absolute; left: 295px; top: 0px;">
    <div class="card" style="height: 399px;">
        ...
    </div>
</div>

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

1 Ответ

0 голосов
/ 17 января 2019

Вы можете использовать Array#join для явного преобразования массива классов в строку имен классов, разделенных пробелами: 

<div class="item col-3 p-2 a b <%= meal[:type].join(' ') %>">

Как это работает: 

> meal[:type]
=> ["program", "veggies"]
> meal[:type].join(' ')
=> "program veggies"

Обратите внимание, что meal[:type].each не делает то, что вы думаете, он делает. Он вызывает блок для каждого элемента в массиве meal[:type], ожидая, что блок выполняет побочный эффект (например, записывает что-то или сохраняет что-то), а затем возвращает неизмененный массив meal[:type]. Если вы хотите получить новый массив, вам придется использовать Array#map вместо: 

> meal[:type].each { |t| t.reverse }
=> ["program", "veggies"] # the block doesn’t affect the return value
> meal[:type].map { |t| t.reverse }
=> ["margorp", "seiggev"] # the block affects each returned element
...