ember.js - 如何在 ember-cli 应用程序中设置 api-stub?

标签 ember.js ember-data

我正在使用 ember-cli 设置一个基本应用程序,但在使用 ember-data 的 api-stub 时遇到了麻烦。我引用了 api-stub README 并引用了 ember 指南,但无法弄清楚我缺少什么。我有点菜鸟,所以请原谅我的任何明显的疏忽。

这是我的设置...

/api-stub/routes.js

server.get('/listings', function(req, res) {
  var listing = {
    "listing": [{
      "id": 1,
      "title": "Sunny 1-bedroom",
      "unit_type": "1br / 1ba",
      "description": "Roomy 1-bedroom apartment in pre-war walkup. Gets great morning light from the south."
    },
    {
      "id": 2,
      "title": "Large 2-bedroom",
      "unit_type": "2br / 1.5ba",
      "description": "Roomy 2-bedroom apartment in pre-war walkup. Gets great morning light from the south."
    }]
  };

  res.send(listing);
});

/app/adapters/application.js

var ApplicationAdapter = DS.RESTAdapter.extend({
    namespace: 'api'
});

export default ApplicationAdapter;

/package.json

{
  ...
  "APIMethod": "stub",
  ...
}

/app/router.js

this.resource('listings', function() {
    this.resource('listing', { path: '/:listing_id' });
});

/app/routes/listings.js

var ListingsRoute = Ember.Route.extend({
    model: function() {
        return this.store.findAll('listing');
    }
});

export default ListingsRoute;

/app/models/listing.js

var attr = DS.attr,
    hasMany = DS.hasMany,
    belongsTo = DS.belongsTo;

var Listing = DS.Model.extend({
  title: attr(),
  unit_type: attr(),
  description: attr()
});

export default Listing

/app/templates/listing.hbs

<h2>{{title}}</h2>
<p>{{unit_type}}</p>
<p>{{description}}</p>

在控制台中,它显示…/api/listings 的 404,而 chrome 中的 ember 检查器未显示任何记录。

非常感谢任何帮助!

最佳答案

最近,ember-cli 现在支持 API stub 。我还让它与以下示例设置一起工作(与您的原始设置非常相似):

/app/adapters/application.js

var ApplicationAdapter = DS.RESTAdapter.extend({namespace: 'api'});

export default ApplicationAdapter;

/app/package.json

{
    ...
    "APIMethod": "stub",
    ...
}

/app/routes/application.js

export default Ember.Route.extend({
    model: function() {
        return Ember.RSVP.hash({
            foos: this.store.findAll('foo'),
            bars: this.store.findAll('bar')
        });
    },

    setupController: function(controller, models) {
        controller.set('foos', models.foos);
        controller.set('bars', models.bars);
    }
});

/app/router.js

var Router = Ember.Router.extend({
  location: ENV.locationType
});

Router.map(function() {
    this.resource('foos', function() {
        this.resource('foo', { path: '/:foo_id' });
    });

    this.resource('bars', function() {
        this.resource('bar', { path: '/:bar_id' });
    });
});

export default Router;

/app/server/routes/foos.js

module.exports = function(app) {
    app.get('/api/foos', function(req, res) {
        res.send({
            'foos': [ 
                    ...
             ]
        });
     })
}

/app/server/routes/bars.js

module.exports = function(app) {
    app.get('/api/bars', function(req, res) {
        res.send({
            'bars': [ 
                    ...
             ]
        });
     })
}

关于ember.js - 如何在 ember-cli 应用程序中设置 api-stub?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22586703/

相关文章:

javascript - 如何在 route 使用服务属性?

javascript - 停留在简单的 Ember.js 示例上,我认为我的 javascript 文件没有被使用

ember.js - Ember 数据和 Northwind OData

javascript - Ember.js 中的 jQuery $.extend() 等价物是什么?

javascript - Ember 验收测试中出现错误

ember.js - Ember 数据嵌套资源 URL

javascript - Ember 绑定(bind)输入值取决于另一个输入

ember.js - 如何使用 store.createRecord() 传递 hasMany 关系的 ID?

ember.js - ember CollectionView 在最后突出显示时设置一个类名

Ember.js:确保 linkTo 助手在嵌套路由上保留事件类