ruby-on-rails - 使用 HAML 在 Rails text_field 占位符中嵌入图标

Question

我正在开发一个 Rails 项目，它正在使用引导程序，我想将来自真棒字体的图标嵌入到文本字段的占位符中。代码如下所示：

#search
  = form_for :search, url: topic_search_path do |f|
    = f.text_field :search_query, placeholder: "Search for topics..."

我知道我通常应该制作一个斜体标签，类是我想要引用的图标，但我不知道我应该如何将它嵌入占位符，更不用说写在 rails form_for 块中了与 HAML。任何帮助是极大的赞赏。

score 3 · Accepted Answer

您可以使用实体在老式方式的值中指定字符plaeholder，只要您首先设置的样式，input使字体为FontAwesome（或至少堆栈中的第一个字体为FontAwsome.

例如，如果您想使用位于代码点的icon-search图标F002（代码点位于图标网页上），那么您想要生成类似这样的内容（假设您为页面设置了 Font Awesome）：

<style>
input /* be more selective here if you want */ {
  font-family: FontAwesome;
}
</style>

<input placeholder="&#xf002; Search for topics...">

要从text_field方法中生成它，只需将实体作为placeholder选项哈希中键值的一部分传递（您可能需要在.html_safe这里使用，我还没有测试过最后一点）：

= f.text_field :search_query, placeholder: "&#xf002; Search for topics..."

（您仍然需要设置样式，input以便它使用正确的字体，如上所述。）

1 回答 1