根据使用erb的单元格值设置表单元格的不同颜色 - 在轨道上使用红宝石

Question

我目前正在为轨道上的红宝石战舰游戏做板。 我被困在如何更改表格单元格的颜色（取决于数组中的哪些值@actions是内部的。我尝试使用case语句，并且if'statement在html.erb中，但我无法找到正确的语法而我想知道另一件事：我应该为此做一个辅助方法和在HTML中使用它，而不是在那里编码

这里是控制器：

class BoardsController < ApplicationController 
    def new 
     @actions = ['none', 'hit', 'miss', 'ship', 'special'] 
     @grid = [] 
     for row in 0..9 
      @grid.push([]) 
      for column in 0..9 
      @grid[row].push({ 
       'action' => @actions.sample 
      }) 
      end 
     end 
    end 
end 

这里是视图：

<table class="table table-striped table-bordered"> 
    <% for row in 0..9 %> 
     <tr> 
      <% for column in 0..9 %> 
       <td> 
        <%= @grid[row][column]['action'] %> 
       </td> 
      <% end %> 
     </tr> 
    <% end %> 
</table> 

Answer 1

我认为最简单的soluti将会为每个动作创建CSS类，例如：

<style> 
    .none { background-color: blue; } 
    .hit  { background-color: red; } 
    .miss { background-color: yellow; } 
    .ship { background-color: white; } 
    .special { background-color: green; } 
</style> 

然后只需添加动作（即， @grid[row][column]['action']）在class属性为td标签：

<% for column in 0..9 %> 
    <td class="<%= @grid[row][column]['action'] %>"></td> 
<% end %> 

---

不相关的问题，但值得注意的是：你也应该选择使用each，而不是for，是更地道。

例如，您的视图代码可以重构为：

<table class="table table-striped table-bordered"> 
    <% (0..9).each do |row| %> 
    <tr> 
     <% (0..9).each do |column| %> 
     <td class="<%= @grid[row][column]['action'] %>"></td> 
     <% end %> 
    </tr> 
    <% end %> 
</table>