ember: Ember data loads into store, won't show up on page

mardi 3 novembre 2015

Ember data loads into store, won't show up on page

I have an ember application that connects to a separate phoenix API. I'm using the ActiveModelAdapter and everything was working fine until I upgraded my ember version to 2.1.0. Now, the data will load into the store but won't show up on the page. My browser's console isn't throwing any errors and I'm just stumped at this point. I've never worked with this version of Ember before so any pointers in the right direction would be much appreciated!

My adapter:

# app/adapters/application.js

import DS from 'ember-data';
import ActiveModelAdapter from 'active-model-adapter';

export default ActiveModelAdapter.extend({
 namespace: 'v1',
 host: 'http://localhost:4000'
});

My router:

import Ember from 'ember';  
import config from './config/environment';

var Router = Ember.Router.extend({  
location: config.locationType
});

export default Router.map(function() {  
  this.route('resources', function() {
    this.route('new');
    this.route('resource', { path: '/:resource_id' });
    });
});

My model:

import DS from 'ember-data';

export default DS.Model.extend({  
  title: DS.attr('string'),
  description: DS.attr('string'),
  url: DS.attr('string'),
  topic: DS.attr('string')
});

My controller:

import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
  editResource: function() {
    this.toggleProperty('isEditing');
  },
  saveResource: function() {
    var resource = this.get('model');
    resource.save();
    this.toggleProperty('isEditing');
    }, 
  },

  isEditing: false
});

My template for the index page to list all of the resources:

<div class="container col-md-6 col-md-offset-3">
  <ul class="list-group">
    {{#each resource in model}}
     <li class="list-group-item active">
      {{#link-to 'resources.resource' resource}}
         <h5>{{resource.title}}</h5> 
     {{/link-to}}</li>
     <li class="list-group-item"><p>topic: {{resource.topic}}</p></li>
     <li class="list-group-item"><p>url: {{resource.url}}</p></li>
    {{/each}}
  </ul>
</div>

This is what I see in the browser console when I try to visit my index page route: localhost:4200/resources