emberjs pre-4 and ember-data: no data on browser-refresh

0
votes

If I browse from the index to a game, the data is shown, because of {{#linkTo}}s context, but if I'm refreshing the site, every time the game name doesn't show up.

EDIT: Here is a fiddle, but unfortunately the fiddle-version with the fixture adapter works properly, even with ken's suggestion to remove the model from the game-template.

the returned data from /api/games is as follows:

{
   "games":[
      {
         "id":1,
         "name":"First Game"
      }
   ]
}

and the returned data from /api/games/1

{
  "game": [
    {
      "id": 1,
      "name": "First Game"
    }
  ]
}

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

<script type="text/x-handlebars" data-template-name="games">
  <ul>{{#each game in controller}}
    <li>{{#linkTo 'game' game}}{{game.name}}{{/linkTo}}</li>
  {{/each}}</ul>
</script>

<script type="text/x-handlebars" data-template-name="game">
  <h1>Name:{{model.name}}</h1>
</script>

<script type="text/javascript">
  App = Ember.Application.create();

  App.Game = DS.Model.extend({
    name: DS.attr('string')
  });

  App.Store = DS.Store.extend({
    revision: 11,
    adapter: DS.RESTAdapter.create({
        namespace: 'api'
    })
  });

  App.GamesController = Ember.ArrayController.extend({
    content: []
  });

  App.GameController = Ember.ObjectController.extend({
    content: null
  });

  App.Router.map(function(match) {
    this.route("games", { path : "/" });
    this.route("game", { path : "/games/:game_id" });
  });

  App.GameRoute = Ember.Route.extend({
    model: function(params) {
        return App.Game.find(params.game_id);
    }
  });

  App.GamesRoute = Ember.Route.extend({
    setupController: function(controller) {
      controller.set('content', App.Game.find());
    }
  });
</script>

Has anyone an idea?

2
ember.jsember-dataember-router

2 Answers

0
votes

Remove model from your game template, try this instead 

<script type="text/x-handlebars" data-template-name="game">
  <h1>Name:{{name}}</h1>
</script>

JSFiddle your code to see where the problem is

0
votes

The response from my server for a single game was wrong. I had an array with a single object in it, but I used the Object controller, so I fixed it with just responding with 

{
  "game": {
    "id": 1,
    "name": "First Game"
  }
}