1

我正在尝试将 ember 集成到我的应用程序中。我想用 ember 替换显示记录列表的表。我有一个休息 api，它将返回表格的数据。但是，下面的 ember 代码从不请求从其余 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"
         }
       ]
   }
}
4

1 回答 1

2

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

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

有了这个，ember 将尝试调用你的 api。但是请求不会发送到您期望的 url：而是会调用/myapp/stuff/list/responses，因为 ember 将复数模型名称附加到适配器的基本 url。

最后，如果您的 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);
    });
  }
});
于 2013-08-21T03:36:23.403 回答