Skip to content

Commit

Permalink
Update guides/release/components/conditional-content.md
Browse files Browse the repository at this point in the history
Co-authored-by: Jen Weber <[email protected]>
  • Loading branch information
2 people authored and locks committed Sep 14, 2022
1 parent d438c4a commit e6d17d4
Showing 1 changed file with 3 additions and 10 deletions.
13 changes: 3 additions & 10 deletions guides/release/components/conditional-content.md
Original file line number Diff line number Diff line change
Expand Up @@ -114,24 +114,17 @@ Like many programming languages, Ember also allows you to write `if else` and
{{/if}}
```

An important feature of `if` statement is that it can be used only inside an
HTML element or another block. For example following snippet won't work
because it uses ``if`` statement **on** the HTML element:
The block form of the `if` statement is typically used to wrap
HTML elements or another block. If you want to use `if` inside of an HTML element, keep reading to learn about how to use inline `if` instead.

```handlebars {data-filename="app/components/sign-in.hbs"}
{{!-- Won't work --}}
<button {{#if @disabled}} disabled {{/if}} class="btn">Sign In</button>
```

Correct usage:
Here's an example of a block `if`, wrapping some HTML elements:

```handlebars {data-filename="app/components/sign-in.hbs"}
{{#if @disabled}}
<button disabled class="btn">Sign In</button>
{{else}}
<button class="btn">Sign In</button>
{{/if}}
```
## Inline `if`
Expand Down

0 comments on commit e6d17d4

Please sign in to comment.