车把条件样式属性

2022-03-01 00:00:00 javascript handlebars.js ember.js

我正在使用ember 1.8.1

控制器有一个属性isDisplay

在把手中,我是这样实现的,它可以工作,但是代码太长

{{#if isDisplay}}
    <div class="form-group">
    </div>
{{ else }}
    <div class="form-group" style="display:none;">
    </div>
{{/if}}

我尝试使用条件,如下所示,但不起作用

<div class="form-group" {{bind-attr class="!isDisplay:'display:none;'"}}>
</div>

解决方案

简单的解决方案是

<div style={{unless isDisplay "display: none;"}}></div>

但是,Ember将抛出将样式直接绑定到元素的警告。请参见Binding Style Attributes

因此,创建类并切换它将是最安全、最干净的方式。

<div class={{unless isDisplay "hide"}}></div>
.hide {
   display: none;
}

相关文章