如何使用 Slim 模板设置 HTML5 属性，例如“必需”答案

【问题标题】：How to set HTML5 attributes like 'required' using a Slim template如何使用 Slim 模板设置 HTML5 属性，例如“必需”
【发布时间】：2013-08-01 18:57:36
【问题描述】：

我正在使用Slim 模板语言来布置表单，并希望将required 属性添加到我的输入中。

input#first_name(required name="first_name" type="text" pattern="^[A-Z][a-z]+$")

但是由此生成的 HTML 最终是

 <input id="first_name" name="first_name" pattern="^[A-Z][a-z]+$" required="" type="text" />

这不是我需要的。

我浏览了文档，但看不到 Slim 添加独立 html5 属性的任何方法。

同样将data-abide 属性添加到form 标记（根据Zurb Foundation 框架的要求）失败。

form.custom(data-abide method="POST" action="/registration")

导致

<form action="/registration" class="custom" data-abide="" method="POST">

Zurb 脚本忽略的内容。

我错过了什么？

【问题讨论】：

Does this help?
没有。见github.com/slim-template/slim/issues/433
实际上this answer 非常准确。显然 attribute="" 等同于独立属性，所以 slim 是正确的。这似乎是 Zurb Foundation 框架中的一个错误，或者更有可能是我自己的一些错误。
我的解决方案是放弃使用 Zurb Foundation 并将我的应用程序移植到 Bootstrap 3

【解决方案1】：

在您的 *.html.slim 文件中：

input#first_name required="" name="first_name" type="text" pattern="^[A-Z][a-z]+$"

注意空属性语法：

<input required>

相当于：

<input required="">

【讨论】：

【解决方案2】：

更具可读性的是：

= f.input :email, required: true, autofocus: true

【讨论】：

【解决方案3】：

使用这个：-

= text_field_tag :user_name, "XYZ", readonly: true, required: true

【讨论】：