Slightly left-field but this took me a while to work out. HAML is great but the extra meta and elements needed to make Bootstrap work were a bit of a pain:

HAML code

.nav-collapse.collapse
  %ul.nav
    %li.active
      %a{:href => "#"} Home
    %li.dropdown
      %a.dropdown-toggle{:href => "#", "role" => "button", "data-toggle" => "dropdown", "data-target" => "#"} 
        The dropdown item
        %b.caret
      %ul.dropdown-menu{"role" => "menu"}
        %li
          %a{:href => "#link1"} 
            Dropdown #1
          %a{:href => "#link2"} 
            Dropdown #2
          %a{:href => "#link3"} 
            Dropdown #3
          %a{:href => "#link4"} 
            Dropdown #4
    %li
      %a{:href => "#contact"} Contact

HTML output (Bootstrap)

<ul class="nav">
  <li class="active">
    <a href="#">Home</a>
  </li>
  <li class="dropdown">
    <a role="button" href="#" data-toggle="dropdown" data-target="#" class="dropdown-toggle">
      The dropdown item
      <b class="caret"></b>
    </a>
    <ul role="menu" class="dropdown-menu">
      <li>
        <a href="#link1">
          Dropdown #1
        </a>
        <a href="#link2">
          Dropdown #2
        </a>
        <a href="#link3">
          Dropdown #3
        </a>
        <a href="#link4">
          Dropdown #4
        </a>
      </li>
    </ul>
  </li>
  <li>
    <a href="#contact">Contact</a>
  </li>
</ul>