Question

Long time listener, first time caller. I’m a 6 month old dev from Code Academy here in Chicago, and I’ve been stuck on this problem for a few hours. Beforehand, I appreciate all of your assistance and time.

I’m converting an ERB template to HAML. The ERB is:

<ul class="nav nav-list">
  <li class="nav-header">
    <%= navigation_header %>
  </li>
  <% @navigation_links.each do |link| %>
  <% if link[:name].present? %>
    <li <%= link[:name] == @topic ? "class='active'" : "" %>>
      <%= link_to link[:name], link[:url] %>
    </li>
  <% else %>
    <hr />
  <% end %>
  <% end %>
</ul>

The ERB line I’m having trouble with is:

<li <%= link[:name] == @topic ? "class='active'" : "" %>>

I’ve tested many variations, read as much of the HAML reference as possible, concentrating on this section:

You can also use #{} interpolation to insert complicated expressions
in a HTML-style attribute:

%span(class="widget_#{@widget.number}")

…and searched Google & StackOverflow, but I cannot get the output correct; HAML keeps disregarding the inline CSS. After all my groundwork, I was so confident in this version, but it didn’t work:

- @navigation_links.each do |link|
  - if link[:name].present?
    %li{ :class => "#{ link[:name] == @topic ? "active" : ""}" }
      = link_to link[:name], link[:url]
  - else
    %hr

I’ve also tried an :erb filter, to no avail:

%ul.nav.nav-list
  %li.nav-header
    = navigation_header
- @navigation_links.each do |link|
  - if link[:name].present?
    :erb
      <li <%= link[:name] == @topic ? "class='active'" : "" %>>
    = link_to link[:name], link[:url]
  - else
    %hr

And I’ve also tried a :css filter, but that failed.

Any ideas what could be wrong? This is my first question on StackOverflow, so if I omitted some helpful info or broke any rules, please let me know.

Answer 1

<li <%= link[:name] == @topic ? "class='active'" : "" %>>

You don’t need variable interpolation. This translates rather easily into HAML as either of the following:

%li{:class => (link[:name] == @topic) && "active"}
%li{:class => (link[:name] == @topic) ? "active" : "" }

The first is preferred in cases where you are including or omitting the value altogether. From the HAML docs:

If a single value is specified and it evaluates to false it is
ignored; otherwise it gets converted to a string. For example:

.item{:class => @item.is_empty? && "empty"}