ember.js，如何从不支持侧面加载的服务器加载主模型时加载相关模型 [英] ember.js, How do I load related models while loading main model from server that is not support sideloading

问题描述

我是 ember.js 新手和面对日常问题： - ）

今天的问题是我的服务器后端不支持侧面加载。 （如果我明白'sideload'是正确的，它是服务器返回相关的模型一次与多个JSON根）

例如，我的服务器只返回以下每个请求： p>

for /api/v1/posts.json

  {
 posts：[{
 id：91，
 title：ember.js
}，{
 id： 81，
标题：ember-data.js
}] 
} 
  

for /api/v1/comments.json

  {
 comments：[{
 id：928，
 postId：91，
}，{
 id：927，
 postId：92，
}] 
} 
  

加载 post model，go /＃/ posts ，该视图没有渲染注释，但如果我加载<通过在位置栏中输入 comment route 的URL来手动输入code>注释 /＃/ comments ，然后返回，评论正确显示。

所以我只是这样尝试，在 post route ，（第三行）

  App.PostsRou​​te = Ember。 Route.extend（{
 model：function（params）{
 this.store.find（'comment'）; 
 return this.store.find（'post'）; 
} 
}）
  

它的工作原理！ （加载和填充评论！）但我认为这是不正确的方式。

有没有什么好的或RIGHT的方式这样做？

编辑 - 添加模型定义

我的帖子模型是这样的：

  App.Post = DS.Model.extend（{
 title：DS.attr（'string'），
 content：DS .attr（'string'），
评论：DS.hasMany（'comment'，{async：true}），
}）
  

，评论模型是：

  App.Account = DS.Model .extend（{
 content：DS.attr（'string'），
 post：DS.belongsTo（'post'），
}）
  

我不使用 ember-cli 并从 ember-



而且，我使用自定义适配器因为我的后端，在fack，不支持ember风格的JSON响应，我无法触摸它：

  App.SpinA dapter = DS.ActiveModelAdapter.extend（{
 host：'http://spin.example.com:8080'，
 namespace：'api / v1'，
 
 init ：function（）{
 this._super（）; 
 console.log（'SpinAdapter ...'）; 
} 
}）; 
 
 App.SpinSerializer = DS.ActiveModelSerializer.extend（{
 extract：function（store，type，payload，id，requestType）{
 console.log（'SpinSezer＃extract ...'+ type +'/'+ id +'/'+ requestType）; 
返回有效负载; 
}，
}）; 
 
 App.PostAdapter = App.SpinAdapter.extend（{}）; 
 App.PostSerializer = App.SpinSerializer.extend（{}）; 
 
 App.CommentAdapter = App.SpinAdapter.extend（{}）; 
 App.CommentSerializer = App.SpinSerializer.extend（{}）; 
  




解决方案

我找到答案，编辑问题！

问题被覆盖提取方法。 （关于我上一个问题的详细信息，我可以在Ember Data上使用normal（rails default）JSON响应吗？）

当我覆盖整个提取，作为答案的问题，我发现一些方法没有被调用。 （也许 _super.extract 做更多的其他事情）。所以我只是用最小的覆盖和调用每个模型 extract 超。它的工作原理是

更改提取方法是：

  App.SpinAdapter = DS.ActiveModelAdapter.extend（{
 host：'http://spin.example.com:8080'，
 namespace：'api / v1'，
 
 init：function（）{
 this._super（）; 
 console.log（'SpinAdapter ...'）; 
} 
}）; 
 
 App.SpinSerializer = DS.ActiveModelSerializer.extend（{
 extract：function（store，type，payload，id，requestType）{
 console.log（'SpinSezer＃extract ...'+'+'/'+ id +'/'+ requestType）; 
 return this._super（store，type，payload，id，requestType）; 
}，
 }）; 
 
 App.PostAdapter = App.SpinAdapter.extend（{}）; 
 App.PostSerializer = App.SpinSerializer.extend（{
 extract：function（store，type，payload，id，requestType）{
 return this._super（store，type，{posts：有效负载}，id，requestType）; 
}，
}）; 
 
 App.CommentAdapter = App.SpinAdapter.extend（{}）; 
 App.CommentSerializer = App.SpinSerializer.extend（{
 extract：function（store，type，payload，id，requestType）{
 return this._super（store，type，{comments：有效负载}，id，requestType）; 
}，
}）; 
  

问题解决了。但可悲的是，由于的回复没有关于评论的条目，（数据库和API结构是只有孩子知道他们的父母）如果我先加载帖子，那么相关的评论没有加载。
一半的解决方案。

我刚刚尝试使用嵌套的路由，希望自动加载嵌套的URL，但不会发生。 ： - （

I'm ember.js newbie and facing daily problems :-)

Today's problem is my server backend doesn't support sideloading. (If I understood 'sideload' right, it is server returns related models at once with multiple JSON root)

for example, my server only returns below per request:

for /api/v1/posts.json

{
  posts: [{
    id: 91,
    title: "ember.js"
  }, {
    id: 81,
    title: "ember-data.js"
  }]
}

for /api/v1/comments.json

{
  comments: [{
    id: 928,
    postId: 91,
  }, {
    id: 927,
    postId: 92,
  }]
}

When I load post model, go /#/posts, the view didnot render comment but if I load comment manually by typing URL of comment route in location bar, /#/comments, and go back, the comments are displayed properly.

so I just try like this, in post route, (third line)

App.PostsRoute = Ember.Route.extend({
  model: function(params) {
    this.store.find('comment');
    return this.store.find('post');
  }
})

and it works! (load and populate comment too!) but I think it is not right way.

Is there any good or RIGHT way to do this?

Edit -- Add model definitions

My post model is something like:

App.Post = DS.Model.extend({
  title: DS.attr('string'),
  content: DS.attr('string'),
  comments: DS.hasMany('comment', {async: true}),
})

and comment model is:

App.Account = DS.Model.extend({
  content: DS.attr('string'),
  post: DS.belongsTo('post'),
})

I do not use ember-cli and started from ember-starter-kit and watching some tutorials from homepage and web.

And, I use custom Adapter because My backend, in fack, does not support ember style JSON response and I cannot touch it:

App.SpinAdapter = DS.ActiveModelAdapter.extend({
  host: 'http://spin.example.com:8080',
  namespace: 'api/v1',

  init: function() {
    this._super();
    console.log('SpinAdapter...');
  }
});

App.SpinSerializer = DS.ActiveModelSerializer.extend({
  extract: function(store, type, payload, id, requestType) {
    console.log('SpinSezer#extract...' + type + '/' + id + '/' + requestType);
    return payload;
  },
});

App.PostAdapter = App.SpinAdapter.extend({});
App.PostSerializer = App.SpinSerializer.extend({});

App.CommentAdapter = App.SpinAdapter.extend({});
App.CommentSerializer = App.SpinSerializer.extend({});

解决方案

I found the answer while I am think more after I edit the question!

the problem is overrided extract method. (details on my prev. question, Can I use normal (rails default) JSON response on Ember Data?)

when I override whole extract, as answer on the question, I found that some method(s) was not called. (maybe _super.extract does more other things.) so I just tested with per model extract with minimal overriding and call super. and it works!

changed extract methods are:

App.SpinAdapter = DS.ActiveModelAdapter.extend({
  host: 'http://spin.example.com:8080',
  namespace: 'api/v1',

  init: function() {
    this._super();
    console.log('SpinAdapter...');
  }
});

App.SpinSerializer = DS.ActiveModelSerializer.extend({
  extract: function(store, type, payload, id, requestType) {
    console.log('SpinSezer#extract...' + type + '/' + id + '/' + requestType);
    return this._super(store, type, payload, id, requestType);
  },
});

App.PostAdapter = App.SpinAdapter.extend({});
App.PostSerializer = App.SpinSerializer.extend({
  extract: function(store, type, payload, id, requestType) {
    return this._super(store, type, {posts: payload}, id, requestType);
  },
});

App.CommentAdapter = App.SpinAdapter.extend({});
App.CommentSerializer = App.SpinSerializer.extend({
  extract: function(store, type, payload, id, requestType) {
    return this._super(store, type, {comments: payload}, id, requestType);
  },
});

Problem is solved. but sadly, since the response of posts has no entry about comments, (Database and API structure is "only child knows their parent") If I load post first, then related comments are not loaded. solution of half.

I just tried with nested routes and hope to load nested URL automatically, but it is not happen. :-(

这篇关于ember.js，如何从不支持侧面加载的服务器加载主模型时加载相关模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！