Haml:: SyntaxError-незаконное вложение: содержимое не может быть одновременно задано в одной строке с %a и вложено в нее

Я использую "выпадающие кнопки" из Twitter Bootstrap с HAML. В Bootstrap docs я нашел пример:

<div class="btn-group">
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Action
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <!-- dropdown menu links -->
  </ul>
</div>

Я попытался переписать его с помощью HAML:

%div{:class => 'btn-group task_controller'}
  %a{:class => 'btn-mini dropdown-toggle', "data-toggle" => 'dropdown', :href => '#'} Action
    %span{:class => 'caret'}
  %ul{:class => 'dropdown-menu'}
    %a{:class => 'close_task', :name => task.name, :href => '#' } Close        

но получил сообщение об ошибке:

Haml::SyntaxError - Illegal nesting: content can't be both given on the same line as %a and nested within it.

Итак, Бутстрэп сказал, что я поместил элемент внутри тега, но ХЭМЛ не позволил это сделать. Как я могу решить проблему?

3 ответов


проблема в этих строках:

%a{:class => 'btn-mini dropdown-toggle', "data-toggle" => 'dropdown', :href => '#'} Action
  %span{:class => 'caret'}

сообщение об ошибке: content can't be both given on the same line as %a and nested within it относится к Action который содержит "в той же строке, что и %a", и %span{:class => 'caret'}, который является содержимым "вложенным в него".

в целом, и, возможно, легче увидеть, вы не можете иметь что-то вроде этого:

%tag Some content here
  And something here as well

исправление для гнезда под %a:

%a{:class => 'btn-mini dropdown-toggle', "data-toggle" => 'dropdown', :href => '#'}
  Action
  %span{:class => 'caret'}

это дает желаемый результат:

<a class='btn-mini dropdown-toggle' data-toggle='dropdown' href='#'>
  Action
  <span class='caret'></span>
</a>

Не забудьте свои идиомы Haml!

#div{:class => 'btn-group task_controller'}

эквивалентно:

.btn-group.task_controller

... etc.


попробуйте это:

%div{:class => 'btn-group task_controller'}
  %a{:class => 'btn-mini dropdown-toggle', "data-toggle" => 'dropdown', :href => '#'}
    Action
    %span{:class => 'caret'}
  %ul{:class => 'dropdown-menu'}
    %a{:class => 'close_task', :name => task.name, :href => '#' } Close  

имя тега и содержимое могут находиться в одной строке, только если в теге больше нет строк содержимого.