我如何在haml中执行内联if语句

时间:2021-02-25 07:40:09

I have this haml

我有这个haml

  %table.form_upper{:style => "display:none;", :id => 'profile-info'}
    %tr{:id => 'some-row'}

How do i do display none on this table if a condition is met like for example i know i can do this but i feel there has got to be an inline way of doing this

如果满足条件,我如何在此表上不显示任何条件,例如我知道我可以做到这一点,但我觉得必须有一个内联的方式这样做

-if condtion
  %table.form_upper{:id => 'profile-info'}
-else
  %table.form_upper{:style => "display:none;", :id => 'profile-info'}
    %tr{:id => 'some-row'}

3 个解决方案

#1


13  

You can do this:

你可以这样做:

%table.form_upper{:style => "display:#{condition ? 'none' : ''};", :id => 'profile-info'}

#2


3  

If you provide an attribute with a nil or false value, Haml will not set it:

如果您提供的属性值为nil或false,则Haml不会设置它:

Haml:

- # substitute an appropriate semantic class name here (not "hidden")
%table.form_upper#profile-info{ class:condition && 'empty' }

CSS:

table.empty { display:none }

#3


1  

This way is better because you separate style from logic therefore you've more control:

这种方式更好,因为您将样式与逻辑分开,因此您可以更好地控制:

In HAML:

%table.form_upper{:class => "#{condition ? '' : 'nonvisible_fupper'};", :id => 'profile-info'}
   %tr{:id => 'some-row'}

and in your CSS file:

并在您的CSS文件中:

.nonvisible_fupper { display:none; }

#1


13  

You can do this:

你可以这样做:

%table.form_upper{:style => "display:#{condition ? 'none' : ''};", :id => 'profile-info'}

#2


3  

If you provide an attribute with a nil or false value, Haml will not set it:

如果您提供的属性值为nil或false,则Haml不会设置它:

Haml:

- # substitute an appropriate semantic class name here (not "hidden")
%table.form_upper#profile-info{ class:condition && 'empty' }

CSS:

table.empty { display:none }

#3


1  

This way is better because you separate style from logic therefore you've more control:

这种方式更好,因为您将样式与逻辑分开,因此您可以更好地控制:

In HAML:

%table.form_upper{:class => "#{condition ? '' : 'nonvisible_fupper'};", :id => 'profile-info'}
   %tr{:id => 'some-row'}

and in your CSS file:

并在您的CSS文件中:

.nonvisible_fupper { display:none; }