在开头插入额外锚点标记(作为第一个列出项目的子项)

Question

我有以下Rails Haml代码:

  %a.dropdown-toggle{ data: { toggle: "#{'dropdown'}"}, href: "#"}
    %span
      %i.glyphicon.glyphicon-filter
      Filter
      %i.icon-caret-down
    %ul.dropdown-menu
      %li.dropdown
        %a{:href => "#"}
          %input{:type => "checkbox", "ng-model" => "search", "ng-true-value" => "a", "ng-false-value" => ""}/
          %span.lbl a
      %li.dropdown
        %a{:href => "#"}
          %input{:type => "checkbox", "ng-model" => "search", "ng-true-value" => "b", "ng-false-value" => ""}/
          %span.lbl b
      %li.divider
      %li.dropdown
        %a{:href => "#"}
          %input{:type => "checkbox", "ng-model" => "search", "ng-true-value" => "c", "ng-false-value" => ""}/
          %span.lbl c
      %li.dropdown
        %a{:href => "#"}
          %input{:type => "checkbox", "ng-model" => "search", "ng-true-value" => "d", "ng-false-value" => ""}/
          %span.lbl d
      %li.dropdown
        %a{:href => "#"}
          %input{:type => "checkbox", "ng-model" => "search", "ng-true-value" => "e", "ng-false-value" => ""}/
          %span.lbl e
      %li.divider

我正在使用带有Rails的bootstrap v.3.2.0.似乎无论我做什么,在渲染此代码时,总会在页面的最开头插入一个额外的锚标记和占位符.

我附上了我得到的结果的图像.如您所见,在第一个%标签之前的顶部总是有一个额外的灰色条.我似乎无法分辨出什么是错的.

当我在额外的行上检查元素时,我发现在%li.dropdown中的第一个%a之前它是一个额外的空锚标记:

<a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-haspopup="true" aria-expanded="false">
                    </a>

我可以从DOM中删除并且条形图消失了.但我似乎无法在我的HAML代码中找到我渲染的地方......

有任何想法吗？

Answer 1

对于起始锚标记，可能是因为您为此行指定了 href。 %a.dropdown-toggle{ data: { toggle: "#{'dropdown'}"}, href: "#"}

尝试删除 href。

我猜你所在的地方：%li.divider是渲染线条的地方。