Ember 数据未填充模型答案

【问题标题】：Ember data not populating modelEmber 数据未填充模型
【发布时间】：2015-10-26 21:29:41
【问题描述】：

我正在尝试从我的 Rails API 中获取一些数据并将其显示在模板中。我对 ember 很陌生，所以解释越简单越好，如果这是一个非常愚蠢的问题，请原谅我。

问题似乎是 api 数据没有正确到达模型，当我有静态夹具数据但不适用于服务器数据时它可以工作。对服务器的 Get 请求正在通过，我得到了很好的响应，所以 json 移动到模型的方式一定有问题。

我在routes/external/jobs.js的路线

import Ember from 'ember';

 export default Ember.Route.extend({ 
   model() {
   return this.store.findAll('job');
}

});

我在models/job.js的工作模型

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    id: DS.attr('string')
});

我希望我的 API 以以下形式返回数据

{
  "jobs": [
      {
        id: "jfdsa132113",
        title: "developer",
        type: "Job",
        body: "lorem ipsum",
        published_at: date,
        tags: [
              "some stuff",
              "more stuff"
        ]
      },
      {
        id: "fdsafd3432",
        title: "designer",
        type: "Job",
        body: "lorem ipsum",
        published_at: date,
        tags: [
              "some stuff",
              "more stuff"
        ]
      }
   ]
}

我的路由器

Router.map(function () {

 //index route

this.route('external', function () {
   this.route('jobs');
   this.route('support');

});

export default Router;

【问题讨论】：

嘿旁注，当前语法是{{#each model as |job|}}。
感谢您的提醒。我更新了它，但不是问题

标签： javascript ruby-on-rails ember.js

【解决方案1】：

我认为你对DS.Models 有误解，你应该看看指南，特别是http://guides.emberjs.com/v2.1.0/models/finding-records/。

假设路由和模板设置正确，并且 ApplicationAdapter 正在扩展 RESTAdapter/ActiveModel Adapter — 请参阅预期的 JSON 格式 here —，我相信问题出在 models/jobs.js，这是不必要的.

当您发送store.findAll('job') 时，Ember Data 应该向/jobs 发出正确的请求。尝试删除 models/jobs.js 和 adapters/jobs.js，然后执行以下操作：

// routes/external/jobs.js
import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return this.store.findAll('job');
  }
});

如果这没有帮助，请尝试同时发布您的路由器以及您遇到的任何错误。

【讨论】：

感谢您的帮助。我相信应用程序适配器设置正确。你是对的，适配器不是必需的，但是删除模型会给出“处理路由时出错：external.jobs 预计会找到：'project/models/job' 中的'model:job'，但出现“未定义”错误跨度>
奇怪，那个模型你还没有吗？
好吧，我摆脱了作业模型，现在只有一个 job.js
对不起，如果不清楚，但我已经更新了问题以反映我目前的应用程序，所以上面的所有内容都是我目前拥有的。我没有收到任何错误，但数据仍未发送到模板。获取请求正在通过，因为我可以在网络开发工具中看到 json 结果

【解决方案2】：

假设您的模型可以从您的 API 正常加载，我认为问题出在您的模板中。

根据文档，您需要显式访问每个模型的属性。 http://guides.emberjs.com/v2.1.0/templates/displaying-a-list-of-items/

所以不要使用{{title}}，而是使用{{job.title}}。

{{#each model as |job|}}
   <a href={{job.title}}>
      <div class="info">
          <div class="title">{{job.body}}</div>
      </div>
   </a>
{{/each}}

【讨论】：

感谢您的帮助。但这并没有解决它。我认为这是模型数据到达模板的问题，可能是命名错误或位置错误？
抱歉，我帮不上忙。我将使用 Ember Inspector 确保您的数据已加载到应用程序中，并且我还将在模板中的循环中抛出 {{debugger}} 语句并检查 model 和 job 变量。也许也为这篇文章安装一个 jsbin，因为很难确切地知道发生了什么。 guides.emberjs.com/v2.1.0/ember-inspector/installation guides.emberjs.com/v2.1.0/templates/development-helpers
没关系，有帮助总比没有好。根据 ember 检查员的说法，我的路线模型是，当我检查数据选项卡并查看相同模型的作业模型时，但内容为 [ ] 且长度为 0。我不确定那是什么意思。我可以看到 get 请求在网络选项卡中返回了正确的 json，所以也许它没有被设置到商店？

【解决方案3】：

这解决了它

添加文件 serializers/job.js 用线条

import DS from 'ember-data';

   export default DS.ActiveModelSerializer.extend(DS.EmbeddedRecordsMixin, {

});

我没有构建 api，我注意到一些 id 是带下划线的约定。更多信息可以在这里阅读http://ember-doc.com/classes/DS.ActiveModelSerializer.html

【讨论】：