This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
ember-routes-and-troubleshooting [2022/06/27 13:08] sausage [Goals for this article] |
ember-routes-and-troubleshooting [2022/06/27 22:35] (current) sausage |
||
|---|---|---|---|
| Line 142: | Line 142: | ||
| {{ :ember:songs-template-songsindex-template-browser.png?nolink |}} | {{ :ember:songs-template-songsindex-template-browser.png?nolink |}} | ||
| - | Well that's interesting, the template of ''template/songs/index.hbs'' is displaying inside the ''%%{{outlet}}%%'' of the ''/templates/songs.hbs'' template. Why is that? | + | Well that's interesting, the template of ''template/songs/index.hbs'' is displaying inside the ''%%{{outlet}}%%'' of the ''/templates/songs.hbs'' template. We've made a nested route. How did we do that? |
| The URL of ''/songs'' matches both the route files of ''/routes/songs.js'' and ''routes/songs/index.js''. But ''songs.hbs'' is treated as the parent, and the ''songs/index.hbs'' is a child and is rendered into the patent's ''%%{{outlet}}%%''. As you can imagine, this is very useful for setting up parent templates (common headers and footers etc) and child content. | The URL of ''/songs'' matches both the route files of ''/routes/songs.js'' and ''routes/songs/index.js''. But ''songs.hbs'' is treated as the parent, and the ''songs/index.hbs'' is a child and is rendered into the patent's ''%%{{outlet}}%%''. As you can imagine, this is very useful for setting up parent templates (common headers and footers etc) and child content. | ||
| Line 159: | Line 159: | ||
| return fetch('http://localhost:4200/some-song-data'); | return fetch('http://localhost:4200/some-song-data'); | ||
| } | } | ||
| + | } | ||
| </code> | </code> | ||
| Line 183: | Line 183: | ||
| ===== Acknowledgements ===== | ===== Acknowledgements ===== | ||
| - | * Thanks to Jeremy.S for his help on the article. | + | * Thanks to Jeremy.S for checking over this article. |
| * A great article that covers similar material on routes is at: [[Getting Started with Ember Octane: Building a Blog | https://emberigniter.com/getting-started-ember-octane-tutorial/]] by Frank Treacy. Well worth a read. | * A great article that covers similar material on routes is at: [[Getting Started with Ember Octane: Building a Blog | https://emberigniter.com/getting-started-ember-octane-tutorial/]] by Frank Treacy. Well worth a read. | ||