使用ruby link_to方法無法正確顯示Bootstrap導航欄下拉菜單

Question

我需要幫助來糾正我的引導導航欄中下拉菜單外觀的一個小問題。 我使用ruby link_to方法為下拉菜單創建了鏈接，這些鏈接正常運行，只是下拉元素與其他導航欄元素的顯示位置不一致。 這是導航欄的當前代碼：

這是問題圖像的鏈接： https : //www.dropbox.com/s/dmrs87xr2kbkat3/dropdown%20problem.jpg?dl=0

 <li class="active"><%= link_to "Main", root_path %> <span class="sr-only">(current)</span> </li> <li class="dropdown"> <%= link_to "Employee Profile", profile_path, :class => "dropdown-toggle", :data => {:toggle => "dropdown"}, :role => "button", :aria => {:expanded => "false"} %> <span class="caret"></span> <ul class="dropdown-menu" role="menu"> <li><a href="#">Tasks / Activities</a></li> <li><a href="#">Vacations</a></li> </ul> </li> 

注意：我設法通過在<％鏈接到...％>標記之間添加一個標記來部分解決該問題，但這會禁用該元素的引導樣式，並將其呈現為常規html。

Answer 1

因為您必須在鏈接中包含<span class="caret"></span> 。

嘗試這個

<%= link_to profile_path, :class => "dropdown-toggle", :data => {:toggle => "dropdown"}, :role => "button", :aria => {:expanded => "false"} do %>Employee Profile <span class="caret"></span> <% end %>

Answer 2

 <div class="dropdown div-inline">
      <button class="btn btn-xs btn-option dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">Show Dropdown
         <span class="caret"></span>
     </button>
          <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">      
                    <li role="presentation">
                         <a href=""> First link</a>
                    </li>  
                    <li role="presentation">
                         <a href=""> Second link</a>
                    </li>  
                    <li role="presentation">
                         <a href=""> Third link</a>
                    </li>  
         </ul>
    </div>

嘗試此操作並訪問Bootstrap下拉示例，以獲取許多適合您需要的示例。