ahnbizcad ahnbizcad - 1 month ago 4x
CSS Question

How to do an inline comparison condition to apply a class in emblem?

I want to do something like this:

li class={aProperty=="alpha":active} Plain Text

where I am using a property, and seeing if it matches a value, as opposed to a simple boolean.

What is the valid emblem syntax for this? The syntax docs only show this for boolean property conditions, and doing something like my example results in browser errors and compile errors.


Unfortunately handlebars and emblem both only work on Booleans. I disagree with this design decision, but you have to jump through some hoops to add helpers to handle them, and even then the syntax isn't very clean.

AFAIK, the only way to do this is via a bool property.

In your controller:

aPropertyAlpha: function() { 
  return this.get('aProperty')==='alpha'; 

In your template:

li class={aPropertyAlpha:active}