Ember.js基于路由器的应用程序在页面刷新时未加载Ember数据对象



我遵循基于路由器的应用程序结构http://emberjs.com/guides/outlets/.
我能够跟随,并使它发挥作用。但当页面显示帖子时(例如/#/posts/2),在加载内容时出现问题,我怀疑这是因为,没有加载特定的帖子。

有什么出路?它不是应该开箱即用吗。

Fiddle示例:http://jsfiddle.net/nachiket/h5Hkm/

App = Ember.Application.create({});
//MODEL
App.Summary = DS.Model.extend({
  content: DS.attr('string')
});
App.Post = DS.Model.extend({
  title: DS.attr('string'),
  summary: DS.hasMany(App.Summary, {embedded: true})
});
App.Post.FIXTURES = [
  {id:1, title: 'My first post', summary: [{id:1, content: 'This is summary1'}]},
  {id:2, title: 'Another post' , summary: [{id:2, content: 'This is summary2'}]},
  {id:3, title: 'Yet another post' , summary: [{id:3, content: 'This is summary3'}]}
];
//STORE
App.store = DS.Store.create({
  revision: 4,
  adapter: DS.fixtureAdapter
});
//ROUTER
App.Router = Ember.Router.extend({
  root: Ember.Route.extend({
    index: Ember.Route.extend({
        route: '/',
        redirectsTo: 'posts'
    }),
    posts: Ember.Route.extend({
        route: '/posts',
        showPost: Ember.Route.transitionTo('post'),
        connectOutlets: function(router){
           router.get('applicationController').
               connectOutlet('posts',App.Post.find());
        }
    }),
    post: Ember.Route.extend({
        route: '/posts/:post_id',
        goBack: Ember.Route.transitionTo('posts'),
        connectOutlets: function(router, post) {
            router.get('applicationController').connectOutlet('post', post);
        }
    })
  })
});
//CONTROLLERS - VIEWS
App.ApplicationController = Ember.Controller.extend({});
App.ApplicationView = Ember.View.extend({
  templateName: 'application'
});
App.PostsController = Ember.ArrayController.extend({
});
App.PostsView = Ember.View.extend({
  templateName: 'posts'
});
App.PostController = Ember.ObjectController.extend({    
});
App.PostView = Ember.View.extend({
  templateName: 'post'
});
App.initialize();

直接输出:http://fiddle.jshell.net/nachiket/h5Hkm/show/light/
作品:http://fiddle.jshell.net/nachiket/h5Hkm/show/light/#/posts
不起作用:http://fiddle.jshell.net/nachiket/h5Hkm/show/light/#/posts/1

Ember路由将字符串"1"而不是数字1传递给find方法以解析post。字符串"1"与任何固定装置都不匹配。将fixture(用于测试目的)更改为具有字符串id应该可以工作。

http://jsfiddle.net/h5Hkm/7/show/light/#/posts/1

在"post"路由中添加反序列化程序就可以了。我建议阅读(至少是"序列化和反序列化状态"部分)http://trek.github.com/.

如果你在让它发挥作用方面有困难,请告诉我,我会制作一把小提琴。

最新更新