Skip to content

Instantly share code, notes, and snippets.

@tylergaw
Last active August 29, 2015 14:24
Show Gist options
  • Select an option

  • Save tylergaw/fc0ee6733a771e6ef568 to your computer and use it in GitHub Desktop.

Select an option

Save tylergaw/fc0ee6733a771e6ef568 to your computer and use it in GitHub Desktop.
Boolean attributes halp

Since the introduction of HTMLBars in Ember, you've been able set attribute on elements in templates using boolean properties.

Here's the example from their docs located at http://guides.emberjs.com/v1.12.0/templates/binding-element-attributes/

Template:

<input type="checkbox" disabled={{isAdministrator}}>

HTML Output:

<input type="checkbox" disabled>

I'm trying to determine if their is a way to do the inverse. With this example, I want to set disabled only if isAdministrator is false.

Here's what I tried that does not work:

<input type="checkbox" disabled={{!isAdministrator}}>

That always results in disabled being applied regardless of the value of `isAdministrator.

Here's an example of how I'd like this to work.

In somecontroller.js:

var isABoolean = false;

In sometemplate.hbs:

<button disabled={{!isABoolean}}>Do Stuff Only if isABoolean is true</button>

In the output.html

<button disabled>Do Stuff Only if isABoolean is tru</button>
@aortbals
Copy link

I wrote up a little example of two approaches to solve this: http://ember-twiddle.com/245f05c2105f92768d04.

TLDR: You cannot have arbitrary expressions in HTMLBars/Handlebars such as !. There are two good approaches to this problem, a computed macro and a not helper. Limiting arbitrary expressions in handlebars is by design as it it would encourage logic to leak into templates.

@tylergaw
Copy link
Author

Thanks @aortbals. Yep, both those approaches are cool. They don't work for my current situation, but I had another way of make it work. Was interested in the second part about the ! or other logic in the template. Makes sense. Not sure I agree with it, but suppose the line has to be drawn somewhere.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment