Question

所以我要将这段.erb代码翻译成.haml。（有人说haml更快，我想我仍然在学习曲线中挣扎;））

<div class="row">
  <div class="col-md-12">
    <ul class="list-inline pull-right">
      <% if current_page?(webservices_path) %>
      <li class="submenu_links_current">
      <% else %>
      <li class="submenu_links">
      <% end %>
        <%= link_to webservices_path do %>
          <i class="fa fa-home" aria-hidden="true" style="color: white;"></i>
          Webservices
        <% end %>
      </li>
    </ul>
  </div>
</div>

我最近的haml翻译：

.row
  .col-md-12
    %ul.list-inline.pull-right
    - if current_page?(webservices_path)
      %li.submenu_links_current
        = link_to webservices_path do
          %i.fa.fa-home{"aria-hidden" => "true", "style" => "color: white;"}
          Webservices
    - else
      %li.submenu_links
        = link_to webservices_path do
          %i.fa.fa-home{"aria-hidden" => "true", "style" => "color: white;"}
          Webservices

我现在对这个haml有两个问题。

如果ul和li之间有if语句，

.pull-right不会应用于ul。

我还发现以下更多分解代码不起作用，因为当前在webservices_path上时，不会显示link_to webservices_path。

.row
  .col-md-12
    %ul.list-inline.pull-right
    - if current_page?(webservices_path)
      %li.submenu_links_current
    - else
      %li.submenu_links
        = link_to webservices_path do
          %i.fa.fa-home{"aria-hidden" => "true", "style" => "color: white;"}
          Webservices

谢谢！

Answer 1

我想你想要这样的东西：

.row
  .col-md-12
    %ul.list-inline.pull-right
      %li{:class => (current_page?(webservices_path) ? 'submenu_links_current' : 'submenu_links')}
        = link_to webservices_path do
          %i.fa.fa-home{"aria-hidden" => "true", "style" => "color: white;"}
          Webservices

请注意，两个li已合并为一个元素，使用哈希的class元素而不是点语法设置类。这将删除重复和link_to。此外，它在ul下缩进（在您的代码中，if语句处于同一级别，因此li不会是它的子级。）

haml pull-right作为第二类，当后面跟着if时不工作

1 个答案: