将 Polymer 条件属性与 HAML 结合使用

Question

根据documentation for Polymer expressions，您可以使用条件属性语法绑定数据以有条件地分配属性：

Conditional attributes

For boolean attributes, you can control whether or not the attribute appears using the special conditional attribute syntax:
attribute?={{boolean-expression}}

太好了，但我使用的是 HAML，其中将属性分配给这样的元素：

%element{attribute: "value"}

如果没有 HAML 提示语法错误，我无法在冒号前添加问号。

那么，当我使用 HAML 生成我的 HTML 时，如何使用 Polymer 的条件属性（或等效功能）？

Answer 1

一个可能的解决方案是使用 :plain 过滤器将原始 HTML 插入到您的 HAML 文件中：

:plain
  <element attribute?={{boolean-expression}}></element>

有点难看，但似乎可以。

如果您需要将一些 HAML 生成的标签包含在其中一个普通 HTML 标签中，您需要使用两次 :plain 过滤器；一次用于开始标签，一次用于结束标签。

:plain
  <element attribute?={{boolean-expression}}>
-# HAML Content Here
:plain
  </element>

确保不要在开始标记后缩进您的 HAML 代码，否则它将成为 "raw HTML" 输出的一部分，并以纯文本形式发送到浏览器，而不是作为 HAML 进行处理。

Answer 2

当前版本的 HAML (4.0.6) 支持条件属性：

%core-menu{hidden?: '{{!globals.current_series_detail}}'}

确保您没有在问号前放置 space。

将 Polymer 条件属性与 HAML 结合使用

Using Polymer conditional attributes with HAML

haml

polymer

Conditional attributes