Cannot read property 'description' of undefined

Question

I am in the process of learning EmberJS using the Ember CLI, but I am having trouble displaying a fixture model in my template

router.js:

Router.map(function() {
  this.resource('calendars', {path: '/'}, function () {
    this.route('new');
  });
});

templates/calendars.hbs

<div class="col-md-4">
  <ul class="list-group">
    {{#each calendar in model}}
      <li>{{calendar.name}}</li>
    {{/end}}
  </ul>
</div>

routes/calendars.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function () {
    return this.store.find('calendar');
  }
});

models/calendar.js

import DS from 'ember-data';

var Calendar = DS.Model.extend({
  name: DS.attr('string')
});

Calendar.reopenClass({
  FIXTURES: [
    {id: 1, name: 'myCalendar'},
    {id: 2, name: 'mySecondCalendar'}
  ]
});

export default Calendar;

adapters/application.js

import DS from "ember-data";

export default DS.FixtureAdapter.extend({});

However, when I visit the root URL /, the server crashes with the following error message

File: nodecal/templates/calendars.hbs
Cannot read property 'description' of undefined

Any idea as to why this is?

Answer 1

Your closing tag in your template is incorrect. Change it to this:

{{#each calendar in model}}
  <li>{{calendar.name}}</li>
{{/each}}