Emberjs没有将JSON转换为模型数组

Question

从我的Emberjs我在Rails服务器上向explore路由发出自定义请求：

GET http://localhost:3000/explore

我在Google Chrome网络检查器中看到了我的JSON响应，但是，我的网页没有呈现任何内容。

要发出自定义请求，我有一个book适配器：

书适配器

import ApplicationAdapter from './application';
import Ember from 'ember';

export default ApplicationAdapter.extend({
  apiManager: Ember.inject.service(),

  findPublishedBooks: function(store, type) {
    let jwt = this.get('apiManager').get('jwt');

    return Ember.RSVP.resolve(
      Ember.$.ajax({
        type: "GET",
        url: this.get('apiManager').requestURL('explore'),
        dataType: 'json',
        headers: {"Authorization": "Bearer " + jwt}
      })
    );
  }
});

探索路线

model() {
  const adapter = this.get('store').adapterFor('book');
  return adapter.findPublishedBooks();
}

在我的Rails方面，我有我的探索行动：

Rails探索行动

def explore
  books = Book.where(published: true)

  if books.count > 0
    render json: books
  else
    return nil
  end
end

我知道我一定是做错了，可能是在我的恩伯方面。

更新

探索模板

<div class="explore">
  {{#search-field searchAction=(action "searchBooks") clearAction=(action "clearSearchBooks")}}{{/search-field}}
  {{#book-grid books=model class="book-grid" isSearching=isSearching}}{{/book-grid}}
</div>

书籍网格模板

{{#each books as |book|}}
  {{#link-to "books.book" book}}
    <div class="book">
      <div class="book-cover">
        <img src={{book.cover.cover.url}} alt="{{book.title}} book cover image" width=173 height=231>
      </div>
      <div class="caption">
        {{book.title}}<br>
        <label>by {{book.author.username}}</label>
      </div>
    </div>
  {{/link-to}}
{{else}}
  {{#if isSearching}}
    <label>No search results.</label>
  {{else}}
    <label>There are no published books at the moment.</label>
  {{/if}}
{{/each}}

Answer 1

我认为您需要了解使用您的代码，您基本上可以使用ember-data商店。要使ember-data工作，您必须将所有数据保存在商店中，这意味着您无法手动调用适配器。你总是要打电话给商店，商店会调用适配器。

所以这是一种反模式：

const adapter = this.get('store').adapterFor('book');
return adapter.findPublishedBooks();

因为它不会将数据推送到商店，或者将它们序列化。

您应该做的是在商店中使用query功能。

如果您需要服务器端筛选列表，可以调用store.query('myModel', anything)。第二个变量将直接传递给适配器。

因此，您可以在路线中拨打return store.query('book', { published:true })，然后在BookAdapter中使用以下内容实施：

apiManager: Ember.inject.service(),

query: function(store, type, query) {
  if(query.published) {
    let jwt = this.get('apiManager').get('jwt');

    return Ember.RSVP.resolve(
      Ember.$.ajax({
        type: "GET",
        url: this.get('apiManager').requestURL('explore'),
        dataType: 'json',
        headers: {"Authorization": "Bearer " + jwt}
      })
    );
  }
}

还要确保返回正确的数据结构。 ember-data需要JSONAPI响应，除非您在序列化程序中更改了此响应。