Question

我根据下面的代码在bootstrap和rails中动态生成标签：

<ul class="nav nav-tabs" role="tablist" id="tabs">
  <% @exercises.each_index do |i| %>
    <% if i == 0 %>
      <li class="active"><a href="#<%= @exercises[i].name.downcase %>" data-toggle="tab" aria-controls="<%= @exercises[i].name.downcase %>"><%= @exercises[i].name %></a></li>
    <% else %>
      <li><a href="#<%= @exercises[i].name.downcase %>" data-toggle="tab" aria-controls="<%= @exercises[i].name.downcase %>"><%= @exercises[i].name %></a></li>
    <% end %>
  <% end %>
</ul>

<div class="tab-content">
  <% @exercises.each_index do |i| %>
    <% if i == 0 %>
      <div class="tab-pane active" id="<%= @exercises[i].name.downcase %>">
        First tab
      </div>
    <% else %>
      <div class="tab-pane" id="<%= @exercises[i].name.downcase %>">
        Other tab
      </div>
    <% end %>
  <% end %>
</div>

问题是@exercises因用户而异，并非预设。由于它没有预设，我需要根据返回的内容生成适当的内容。 First tab和Other tab需要由特定于用户和练习的内容替换。

这样做有干净的方法吗？

Answer 1

如果练习belong_to用户

，那就最好了

在用户模型中添加has_many :exercises，在练习模型中添加belongs_to :user。练习对象应该有一个user_id字段来引用用户拥有它的内容。然后，您可以通过user.exercises为所有练习调用您的用户。如果您正在使用设计，则会current_user.exercises

添加更改后，您将获得以下内容。哦，只需将 if 添加到<li>的{{1}} HTML标记即可摆脱if / else混乱。

class="active"

相同的结果，更少的代码。

您也可以在不使用索引的情况下完成每个练习循环，并按如下方式更改if语句：

<% @exercises = current_user.exercises %>
<ul class="nav nav-tabs" role="tablist" id="tabs">
  <% @exercises.each_index do |i| %>
      <li <%= 'class="active"' if i == 0 %>><a href="#<%= @exercises[i].name.downcase %>" data-toggle="tab" aria-controls="<%= @exercises[i].name.downcase %>"><%= @exercises[i].name %></a></li>
  <% end %>
</ul>

<div class="tab-content">
  <% @exercises.each_index do |i| %>
      <div class="tab-pane <%= 'active' if i == 0 %>" id="<%= @exercises[i].name.downcase %>">
        Tab Content
      </div>
  <% end %>
</div>

或者每个实例和索引

<% @exercises.each do |ex| %>
  <div class="tab-pane <%= 'active' if @exercises.first == ex %>" id="<%= ex.name.downcase %>">
    Tab Content
  </div>
<% end %>

对于标签内容，您只需要知道您在哪些字段中使用哪些特征。取决于你拥有的东西。

<% @exercises.each.with_index do |ex, i| %>
  <div class="tab-pane <%= 'active' if i == 0 %>" id="<%= ex.name.downcase %>">
    Tab Content
  </div>
<% end %>

这实际上取决于您的型号和您可用的字段。

动态加载引导轨中动态生成的选项卡中的内容

1 个答案: