mercredi 15 mars 2017

How do I use ember-crumbly for non-nested routes?

I'm trying add breadcrumbs to this application using ember-crumbly.

I couldn't find the git repo, so to see the code, you'll have to clone the full application by clicking the button "Download git repository" in Course Material and then go to the branch step-14 by running the following command after going into the repo via command line:

git checkout step-14

I'm adding breadcrumbs by making the following changes to the files:

app/routes/album.js

import Ember from 'ember';

export default Ember.Route.extend({
  breadCrumb: {
    title: 'Album'
  }
});

app/routes/index.js

import Ember from 'ember';

export default Ember.Route.extend({
  breadCrumb: {
    title: 'Home'
  },
  model() {
    return this.store.findAll('album');
  }
});

app/templates/application.hbs

<header>
  <h1>BümBöx</h1>
</header>

<div class="breadcrumb">
  
</div>





I'm hoping when I go to http://localhost:4200/album/1, it would look like this: enter image description here

but instead, it looks like this: enter image description here

I'm guessing it's because my routes are not nested in directories (as in it's not app/routes/home/album.js), which isn't compatible with the demo from ember-crumbly. Can someone help me figure out how to add ember-crumbly to this application? Much appreciate.




Aucun commentaire:

Enregistrer un commentaire