将 Twitter Bootstrap 按钮图标添加到 Rails 中的 button_to [英] Adding a Twitter Bootstrap button icon to button_to in Rails

问题描述

我正在研究 使用 Rails 进行敏捷 Web 开发书，但我一直在使用 Twitter Bootstrap 而不是书中的自定义样式.我无法通过 Glyphonics 向 button_to 方法添加图标.我的代码如下所示:

I am working through the Agile Web Development with Rails book but I have been using Twitter Bootstrap instead of the custom styling from the book. I am having trouble adding an icon through GLyphonics to the button_to method. My code looks like this:

<%= button_to <i class="icon-search icon-white">Add To Cart</i>, 
              line_items_path(product_id: product), 
              class: "btn btn-success" %>

我尝试了很多变体，但似乎无法正常工作.

I have tried quite a few variations but can't seem to get it to work correctly.

推荐答案

您的报价好像有问题:

<%= button_to raw("<i class=\"icon-search icon-white\">Add To Cart</i>"), 
          line_items_path(product_id: product), 
          class: "btn btn-success" %>

将按钮的标签用双引号括起来，将 i 标签中的双引号转义，最后，将所有内容包装到 raw() 调用中以确保HTML 正确显示.

Enclose the label of the button in double quotes, escape the double quotes in your i tag, and finally, wrap everything into a raw() call to ensure the HTML is properly displayed.

或者你可以使用 html_safe:

<%= button_to "<i class=\"icon-search icon-white\">Add To Cart</i>".html_safe, 
          line_items_path(product_id: product), 
          class: "btn btn-success" %>

<小时>

@jordanpg 的优点:按钮的值中不能包含 HTML，因此他的解决方案更合适，应该获得批准状态.html_safe 部分仍然有效.

这篇关于将 Twitter Bootstrap 按钮图标添加到 Rails 中的 button_to的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！