EmberJS没有要求从rest api获取数据

时间:2013-08-21 01:05:32

标签: javascript ember.js ember-data

我正在尝试将ember集成到我的应用中。我想用ember替换显示记录列表的表。我有一个休息api将返回表的数据。但是,下面的余烬代码从未请求从其余的api获取数据。

var App = Ember.Application.create({});

App.Router.map(function() {

});

App.Store = DS.Store.extend({
    revision: 11,
    adapter: DS.RESTAdapter.extend({
        url: '/myapp/stuff/list'
    })
});

App.Response = DS.Model.extend({
    author: DS.attr("string"),
    book: DS.attr("string")
});

以下是我在html页面中的内容:

    <script type="text/x-handlebars">
        <h1>whatever</h1>

        {{#each model}}
        <h1>{{author}}</h1>
        {{/each}}
    </script>

但是,在浏览器上我唯一看到的是whatever。我没有看到API的结果,也没有看到myapp/stuff/list的请求。

我的API看起来像这样:

{
  "meta": {
     "code": 200
   }
   "response": {
      "stuff": [{
         "id": 1,
         "author": "someone",
         "book": "some book"
         },
         {
         "id": 2,
         "author": "some author",
         "book": "anotherbook"
         }
       ]
   }
}

1 个答案:

答案 0 :(得分:2)

好的,这里有一些事情发生。首先是没有路由定义,您可以在其中指定ember应如何查找模型数据。在这种情况下,您可以使用调用api的模型钩子指定应用程序路径,例如:

App.ApplicationRoute = Ember.Route.extend({
  model: function(){
    return App.Response.find();
  }
});

有了这个,ember会尝试打电话给你的api。但请求不会出现在您期望的网址上:相反,它会调用/myapp/stuff/list/responses,因为ember会将复数模型名称附加到适配器的基本网址。

最后,如果你的api返回上面的json ember会抱怨你的服务器返回了一个带有密钥响应的哈希,但你没有映射。按照惯例,API应该返回响应数组而不是单个响应。以下内容适用:

{
"meta": {
 "code": 200
 },
 "responses": [
   { "id": 1, "author": "someone", "book": "some book "},
   { "id": 2, "author": "some author", "book": "anotherbook" }
 ]
}

我在这里发布了一个工作示例(使用模拟api响应的自定义适配器)http://jsbin.com/ICoYUxU/2/edit?html,js,output

App = Ember.Application.create({});

App.Router.map(function() {});

App.Response = DS.Model.extend({
    author: DS.attr("string"),
    book: DS.attr("string")
});

App.ApplicationRoute = Ember.Route.extend({
  model: function(){
      return App.Response.find();
  }
});

App.Store = DS.Store.extend({
  adapter: 'App.Adapter'
});

var responses = {
  "meta": {
     "code": 200
   },
   "responses": [
     { "id": 1, "author": "someone", "book": "some book "},
     { "id": 2, "author": "some author", "book": "anotherbook" }
   ]
};

App.API = {
  '/myapp/stuff/list/responses': responses
};

App.Adapter = DS.RESTAdapter.extend({
  url: '/myapp/stuff/list',
  ajax: function(url, type, hash) {
    json = App.API[url];
    console.log('App.Adapter.ajax:', url, type, hash, json);
    return new Ember.RSVP.Promise(function(resolve, reject) {
      Ember.run(null, resolve, json);
    });
  }
});