来自Mirage的Ember数据无法在index.hbs

时间:2016-02-05 22:24:36

标签: javascript ember.js ember-cli-mirage

Ember新手在这里。我一直在关注Ember网站上的教程here.

我一直在研究这个词的例子,一切正常......直到我尝试实施幻影。数据永远不会出现在index.hbs页面上。

这是我的模特钩子:

import Ember from 'ember';

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

我的模特:rental.js

import DS from 'ember-data';
export default DS.Model.extend({
  title: DS.attr('string'),
  owner: DS.attr('string'),
  city: DS.attr('string'),
  type: DS.attr('string'),
  image: DS.attr('string'),
  bedrooms: DS.attr('number')
});

我的index.hbs:

<h1> Welcome to Super Rentals </h1>

We hope you find exactly what you're looking for in a place to stay.

{{#each model as |rentalUnit|}}
  {{rental-listing rental=rentalUnit}}
{{/each}}


{{#link-to "about"}}About{{/link-to}}
{{#link-to "contact"}}Click here to contact us.{{/link-to}}

最后是我的app / mirage / config.js:

export default function() {
  this.get('/rentals', function() {
    return {
      data: [{
        type: 'rentals',
        id: 1,
        attributes: {
          title: 'Grand Old Mansion',
          owner: 'Veruca Salt',
          city: 'San Francisco',
          type: 'Estate',
          bedrooms: 15,
          image: 'https://upload.wikimedia.org/wikipedia/commons/c/cb/Crane_estate_(5).jpg'
        }
      }, {
        type: 'rentals',
        id: 2,
        attributes: {
          title: 'Urban Living',
          owner: 'Mike Teavee',
          city: 'Seattle',
          type: 'Condo',
          bedrooms: 1,
          image: 'https://upload.wikimedia.org/wikipedia/commons/0/0e/Alfonso_13_Highrise_Tegucigalpa.jpg'
        }
      }, {
        type: 'rentals',
        id: 3,
        attributes: {
          title: 'Downtown Charm',
          owner: 'Violet Beauregarde',
          city: 'Portland',
          type: 'Apartment',
          bedrooms: 3,
          image: 'https://upload.wikimedia.org/wikipedia/commons/f/f7/Wheeldon_Apartment_Building_-_Portland_Oregon.jpg'
        }
      }]
    };
  });
}

我在Chrome开发者控制台中收到两条消息:

  

Mirage:您的Ember应用尝试获取&#39; http://localhost:4200/assets/vendor.js&#39;,但没有定义处理此请求的路由。在mirage / config.js文件中定义与此路径匹配的路径。您是否忘记添加名称空间?

和这个警告:

  

警告:遇到&#34;数据&#34;在有效载荷中,但没有找到型号名称的模型&#34;数据&#34; (使用super-rental @ serializer解析模型名称:-rest:.modelNameFromPayloadKey(&#34; data&#34;))

然而,看起来信息是成功检索的,因为我看到了:

  

成功请求:GET /租赁   对象{data:Array [3]}

反映了正确的数据。它只是打破了它和index.hbs之间的某个地方,而且我是新手想出来的。我确信这对我来说只是一个小小的误解。任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:1)

您安装了错误的Ember Data版本。还要确保在安装依赖项时重新启动服务器。

您收到的错误消息表示您的应用程序正在使用RESTAdapter(Ember Data 1.x的默认适配器)。这就是它查看顶级data密钥并尝试单一化并找到相关模型的原因。

您可以按照latest Ember CLI release上的说明进行更新。或者,您可以npm install -g ember-cli@beta并从头开始。