Middleman App Haml syntax error with Handlebars

Question

I am trying to do this and build using Middleman App

%script{:type => "text/html", :id => "showItem"}
  {{#items}}
  %li
    %a{href: "#{{id}}"} {{showName}}
  {{/items}}

The problem is this line %a{href: "#{{id}}"} when {{id}} is inside another {}

Here is the error

SyntaxError at /show.html
/show.haml:110: syntax error, unexpected '}', expecting tASSOC ...tributes({}, nil, href: "#{{id}}")}>{{showName}}</a>\n ... ... ^ /show.haml:127: syntax error, unexpected ',', expecting '}' ...script>\n </body>\n</html>\n", -2, false); ... ^ /show.haml:131: syntax error, unexpected keyword_end, expecting '}'

Ruby    C:/Ruby193/lib/ruby/gems/1.9.1/gems/tilt-1.3.3/lib/tilt/template.rb: in instance_eval, line 209
Web GET localhost/show.html

Is there a way to get around that? Since I need to use Handlebars to parse out a variable within a tag's attribute.

Thanks.

Answer 1

The #{{id}} is being evaluated by Haml as string interpolation. So it sees the outer #{...} as the container for the Ruby code to be evaluated (just like any standard Ruby code would), and it therefore tries to evaluate {id} in Ruby.

Ruby sees the curly braces around id and expects a hash, which is why you get the "unexpected '}'" error.

The solution is to escape the # to avoid string interpolation:

%a{href: "\#{{id}}"} {{showName}}