Skip to content

Commit

Permalink
Merge pull request ember-learn#177 from jamescdavis/revert_fix_beta_b…
Browse files Browse the repository at this point in the history
…uild

Revert "Fix beta build"
  • Loading branch information
chancancode authored Feb 5, 2021
2 parents ca0660d + 0176a44 commit d002ef7
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 15 deletions.
8 changes: 3 additions & 5 deletions src/markdown/tutorial/part-1/08-working-with-data.md
Original file line number Diff line number Diff line change
Expand Up @@ -348,23 +348,21 @@ The last change we'll need to make is to our `index.hbs` route template, where w
Let's see how.

<!-- Workaround for https://github.com/emberjs/ember.js/issues/19334 -->

```run:file:patch lang=handlebars cwd=super-rentals filename=app/templates/index.hbs
@@ -8,5 +8,5 @@
<ul class="results">
- <li><Rental @rental={{@model}} /></li>
- <li><Rental @rental={{@model}} /></li>
- <li><Rental @rental={{@model}} /></li>
+ {{#each @model as |property|}}
+ <li><Rental @rental={{property}} /></li>
+ {{#each @model as |rental|}}
+ <li><Rental @rental={{rental}} /></li>
+ {{/each}}
</ul>
```

We can use the `{{#each}}...{{/each}}` syntax to iterate and loop through the array returned by the model hook. For each iteration through the array&mdash;for each item in the array&mdash;we will render the block that is passed to it once. In our case, the block is our `<Rental>` component, surrounded by `<li>` tags.

Inside of the block we have access to the item of the *current* iteration with the `{{property}}` variable. But why `property`? Well, because we named it that! This variable comes from the `as |property|` declaration of the `each` loop. We could have just as easily called it something else, like `as |rental|`, in which case we would have to access the current item through the `{{rental}}` variable.
Inside of the block we have access to the item of the *current* iteration with the `{{rental}}` variable. But why `rental`? Well, because we named it that! This variable comes from the `as |rental|` declaration of the `each` loop. We could have just as easily called it something else, like `as |property|`, in which case we would have to access the current item through the `{{property}}` variable.

Now, let's go over to our browser and see what our index route looks like with this change.
Expand Down
18 changes: 8 additions & 10 deletions src/markdown/tutorial/part-2/12-provider-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,8 +58,6 @@ Wait...why don't we just refactor the search box into a component? Once we do th

Let's start simple again and begin our refactor by creating a new template for our component, which we will call `rentals.hbs`.

<!-- Workaround for https://github.com/emberjs/ember.js/issues/19334 -->

```run:file:create lang=handlebars cwd=super-rentals filename=app/components/rentals.hbs
<div class="rentals">
<label>
Expand All @@ -68,8 +66,8 @@ Let's start simple again and begin our refactor by creating a new template for o
</label>
<ul class="results">
{{#each @rentals as |property|}}
<li><Rental @rental={{property}} /></li>
{{#each @rentals as |rental|}}
<li><Rental @rental={{rental}} /></li>
{{/each}}
</ul>
</div>
Expand All @@ -87,8 +85,8 @@ There is one minor change to note here: while extracting our markup into a compo
- </label>
-
- <ul class="results">
- {{#each @model as |property|}}
- <li><Rental @rental={{property}} /></li>
- {{#each @model as |rental|}}
- <li><Rental @rental={{rental}} /></li>
- {{/each}}
- </ul>
-</div>
Expand Down Expand Up @@ -285,12 +283,12 @@ Well, in order to answer this question, let's look at how the data that we're yi
```run:file:patch lang=handlebars cwd=super-rentals filename=app/components/rentals.hbs
@@ -7,5 +7,7 @@
<ul class="results">
- {{#each @rentals as |property|}}
- <li><Rental @rental={{property}} /></li>
- {{#each @rentals as |rental|}}
- <li><Rental @rental={{rental}} /></li>
- {{/each}}
+ <Rentals::Filter @rentals={{@rentals}} @query={{this.query}} as |results|>
+ {{#each results as |property|}}
+ <li><Rental @rental={{property}} /></li>
+ {{#each results as |rental|}}
+ <li><Rental @rental={{rental}} /></li>
+ {{/each}}
+ </Rentals::Filter>
</ul>
Expand Down

0 comments on commit d002ef7

Please sign in to comment.