Ember.js动态模型请求 [英] Ember.js dynamic model requests

查看:97
本文介绍了Ember.js动态模型请求的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试根据先前的模型请求的结果向商店发出一个模型请求。请查找以下代码:



路线:

 模型(params){
var id = params.framework_id;
var main = this;
return Ember.RSVP.hash({
question:this.store.query('question',{orderBy:'framework',equalTo:id}),
framework:this.store .find('frameworks',id),
框架:this.store.findAll('frameworks')
})
}
pre>

然后在路由中有一个setupController:

  setupController :function(controller,model){
this._super(controller,model);
var main = this;
...
controller.set(frameworkName,model.framework.get('name'));

var includedFramework = model.framework.get('includedFramework');
var includedFrameworkModel = this.store.find('frameworks',includedFramework);

Ember.Logger.info(model.framework)
Ember.Logger.info(includedFrameworkModel);

if(model.framework.get('includedFramework')!= undefined){
var linked = main.store.find(frameworks,model.framework.get('includedFramework ));
controller.set(linkedFramework,{id:linked.get('id'),name:linked.get('name')});
}
}

在控制器设置中,使用 model.framework.get('name')工作没有问题。 mode.framework.get('includedFramework')正常工作,并将ID存储到框架模型中存储的另一个框架。然后,我打算用另一个 store.find 请求在商店中拉包含的框架。不幸的是,第二个 store.find 不会以与第一个相同的方式返回模型记录。以下是每个请求返回的检查器视图:



model.framework -





includedFrameworkModel -





任何帮助都非常感谢!

解决方案

数据返回可能需要向服务器发出请求的内容,例如 find() findAll() query() save(),异步关系返回一个 PromiseObject PromiseArray



对于对象和数组来说,它的工作方式相同,所以只是让我们来描述数组如何工作。



A PromiseArray 都是 承诺 ArrayProxy
这是非常有用的,因为您可以通过两种方式使用它,具体取决于您的情况。



由于向服务器的请求可能需要一些时间,由此产生的 ArrayProxy 部分通常是空的,稍后会被填入数据。这是非常有用的,因为当$ code> ArrayProxy 更改时,您的句柄模板和计算属性将更新。



Promise部分 PromiseArray 将立即从服务器收到数据,并使用实际的数组来解析,当您对数据进行进一步更改时,它也可能会更新。



然而,Ember路由器将等待承诺在加载路由之前解决,这样可以指定加载底层。



这就是为什么 model.framework setupController 。这不是 .find()的结果,而是解决的承诺的结果。这基本上是什么 Ember.RSVP.hash 为您做的。






通常我建议你两件事。


  1. 不要在模型上存储模型ID,而是使用关系。

  2. 不要在 .setupController()中调用商店。在 .model()中执行所有请求,并使用承诺链来执行此操作。

也许以此为灵感:

  return Ember.RSVP.hash({
question :this.store.query('question',{orderBy:'framework',equalTo:id}),
框架:this.store.find('frameworks',id),
框架:这.store.findAll('frameworks')
})然后(({question,framework,frameworks})=> {
let includedFramework = framework.get('includedFramework');
let includeFrameworkModel = this.store.find('frameworks',includedFramework);
return {question,framework,frameworks,includedFrameworkModel};
});


I am trying to make a request from the store for a model based on the result of a previous model request. Please find the code below:

For the route:

model(params) {
  var id = params.framework_id;
  var main = this;
  return Ember.RSVP.hash({
    question: this.store.query('question', {orderBy: 'framework', equalTo: id}),
    framework: this.store.find('frameworks', id),
    frameworks: this.store.findAll('frameworks')
  })
}

Then in the route there is a setupController:

setupController: function(controller, model) {
  this._super(controller, model);
  var main = this;
  ...
  controller.set("frameworkName", model.framework.get('name'));

  var includedFramework = model.framework.get('includedFramework');
  var includedFrameworkModel = this.store.find('frameworks', includedFramework);

  Ember.Logger.info(model.framework)
  Ember.Logger.info(includedFrameworkModel);

  if (model.framework.get('includedFramework') != undefined) {
    var linked = main.store.find("frameworks", model.framework.get('includedFramework'));
    controller.set("linkedFramework", {id: linked.get('id'), name: linked.get('name')});
  }
}

In the controller setup, using model.framework.get('name') works without a problem. mode.framework.get('includedFramework') works fine and returns an ID to another framework that is stored in the framework model. I then intend to pull the "included framework" in the store with another store.find request. Unfortunately this second store.find doesn't return the model record in the same way as the first. Here is an inspector view of what each request returns:

model.framework -

includedFrameworkModel -

Any help is greatly appreciated!

解决方案

Well, every call to ember-data that returns something that may require a request to the server, like find(), findAll(), query(), save(), and async relationships returns a PromiseObject or a PromiseArray.

It works the same way for objects and arrays, so just lets describe how arrays work.

A PromiseArray is both, a Promise and a ArrayProxy. This is very useful because you can work with it in both ways, depending on your situation.

Because the request to the server may take some time, the resulting ArrayProxy part is often empty, and will be populated with data later. This is very useful because your handlebars template and computed properties will update when the ArrayProxy changes.

The Promise part of the PromiseArray will resolve as soon the data are received from the server, with an actual array, that also may update later when you do further changes on your data.

The ember router however will wait for the promise to be resolved before it loads the route, which allows you to specify a loading substrate.

This is why model.framework is different in setupController. It's not the result of the .find() but the result of the resolved promise. Thats basically what Ember.RSVP.hash does for you.


Generally I recommend you two things.

  1. Don't store a model id on a model, but use a relationship.
  2. Don't call the store in .setupController(). Do all your requests in the .model() hook and use the promise chain to do so.

Maybe take this as a inspiration:

return Ember.RSVP.hash({
  question: this.store.query('question', {orderBy: 'framework', equalTo: id}),
  framework: this.store.find('frameworks', id),
  frameworks: this.store.findAll('frameworks')
}).then(({question, framework, frameworks}) => {
  let includedFramework = framework.get('includedFramework');
  let includedFrameworkModel = this.store.find('frameworks', includedFramework);
  return {question, framework, frameworks, includedFrameworkModel};
});

这篇关于Ember.js动态模型请求的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆