如何在 Haml 中制作动态 ID？答案

【问题标题】：How do I make dynamic ids in Haml?如何在 Haml 中制作动态 ID？
【发布时间】：2011-01-14 03:01:21
【问题描述】：

#item

创建一个 id="item" 的 div

.box#item

用 class="box" 和 id="item" 创建一个 div

.box#="item "+x

创建一个带有 class="box" 和注释 '#="item"+x' 的 div

.box#
  ="item"+x

抛出“非法元素：类和 id 必须有值。”

如何将 id 设置为变量？

【问题讨论】：

【解决方案1】：

您可以通过以下方式在HAML中设置id和class

正常方式

.box.item#item

<div id="item" class="box item"></div>

如果需要插值可以使用这种格式

.box{id: "item_#{123}", class: "item_#{123}"}

<div id="item_123" class="box item_123"></div>

这种格式使用对象引用生成类和id

# app/controllers/items_controller.rb 
@item = Item.find(123)

.box[@item]

<div id="item_123" class="box item"></div>

如果你需要前缀一些东西

.box[@item, :custom]

<div id="custom_item_123" class="box custom_item"></div>

如果您需要自定义类和 id 生成，您需要将以下方法添加到模型中。

class CrazyUser < ActiveRecord::Base
  def haml_object_ref
    "customized_item"
  end
end

然后你会得到自定义的类

.box[@item]

<div id="customized_item_123" class="box customized_item"></div>

参考：

【讨论】：

【解决方案2】：

有两种方式：

长格式方式（将 id 定义为常规属性）：

.box{:id => "item_#{x}"}

产生这个（x 是 x.to_s 评估的结果）：

<div class="box" id="item_x">

简写方式：

.box[x]

假设x 是item 的一个实例，则生成以下内容：

<div class="box item" id="item_45">

请参阅HAML reference 了解更多信息。

【讨论】：