Simple ember app not working

1

Models unavailable in template. I have a very simple ember app. I’ve spent many hours trying this every different way I could think of. Have read and reread the documentation. This was working, now it’s not. Why not? What am I missing?

window.Cinder = Ember.Application.create({  
  LOG_TRANSITIONS: true  
});

Cinder.Store = DS.Store.extend({
  revision: 12,
  adapter: DS.FixtureAdapter
});

Cinder.User = DS.Model.extend({
  name: DS.attr('string')
});

Cinder.User.FIXTURES = [
  {
    id: 1,
    name: 'J.R. "Bob" Dobbs'
  },
  {
    id: 2,
    name: 'Dalek Caan'
  },
  {
    id: 3,
    name: 'Gaius Baltar'
  },
];

Cinder.Router.map(function() {
  this.route('about');
  
  this.resource('users', function() {
    this.route('new',  { path: 'new' });
    this.route('show', { path: ':user_id' });
    this.route('edit', { path: ':user_id/edit' });
  });
});

Cinder.UsersRoute = Ember.Route.extend({
  model: function() {
    return Cinder.User.find();
  }
});

<script type="text/x-handlebars">
  <div class="row">
    <div class="large-12 columns">
      <h1>Cinder</h1>
      <div>
        {{outlet}}
      </div>
    </div>
  </div>
</script>

<script type="text/x-handlebars" data-template-name="index">
  <p>home</p>
</script>

<script type="text/x-handlebars" data-template-name="about">
  <p>about us</p>
</script>

<script type="text/x-handlebars" data-template-name="users">
  {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="users/index">
  <h2>Users</h2>
  <ul>
    {{#each user in model}}
      <li>{{#linkTo users.show user}}{{user.name}}{{/linkTo}}</li>
    {{else}}
      <li>No users yet!</li>
    {{/each}}
  </ul>
</script>

<script type="text/x-handlebars" data-template-name="users/new">
  <p>users new</p>
</script>

<script type="text/x-handlebars" data-template-name="users/show">
  <p>{{name}}</p>
</script>

<script type="text/x-handlebars" data-template-name="users/edit">
  <p>users edit</p>
</script>

You can see the output here: http://munat.com/ember.png

2

What did you change for it to stop working? :slight_smile:

I can’t spot anything obviously wrong, so I’d be interested in the solution if anyone else spots something.

3

Okay, moving your users/index template into your users template works.

I’m (definitely) no expert on ember, but it looks like the model loaded in your UsersRoute is only available to your users template and not the users/index template for some reason (as far as I’m aware, they’re one in the same for the /users route, so that seems a little weird).

<script type="text/x-handlebars" data-template-name="users">
  <h2>Users</h2>
  <ul>
    {{#each user in model}}
      <li>{{#linkTo users.show user}}{{user.name}}{{/linkTo}}</li>
    {{else}}
      <li>No users yet!</li>
    {{/each}}
  </ul>

  {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="users/index">
</script>
4

Thanks! This is slowly coming clear to me. There really needs to be a better way to troubleshoot this stuff.

The new introduction on the Ember site rocks! But I still am having problems of the simplest nature. For example, I have an AutomobilesRoute that’s using an automobiles template and it works great. I added an AutomobilesController and a simple property (caption) for the table’s caption, but nothing I do will make it appear in the page. I’ve checked everything against the documentation and the example apps, and I see nothing wrong. There are no errors, of course.

It’s this sort of frustrating experience that makes Ember difficult to adopt. When the magic works, it’s beautiful. When it doesn’t, good luck! I’m currently trying to teach Ember to a classroom full of web developers and they are all frustrated.

So thanks much for the help! I’m sure I’ll get it all figured out soon.

5

Yeah, I’m only just (trying) to find my feet too. I seem to be wasting ungodly amounts of hours on tiny bugs. Ah well, it’ll be worth it.

Post the code for your Automobiles problem if you’d like me to run a fresh pair of eyes over it.

6

Heh, heh. This was big brain fart. Two hours banging my head agains the wall, and the problem? Wasn’t loading the controller’s js file. Sigh… Thanks for the attempted help, though.