在 Emberjs 中成功调用 ajax 后如何加载 ember 模型？

Question

我在 app/models 中定义了一个名为 todo.js 的模型，如下所示：

export default DS.Model.extend({
  title: DS.attr('string'),
  created_at: DS.attr('date'),
  updated_at: DS.attr('date'),
  is_deleted: DS.attr('boolean'),
  is_done: DS.attr('boolean')
});

假设我不想使用 ember-data & 我只是想像这样使用普通的旧 ajax:

export default Ember.Route.extend({
  model() {
    return Ember.$.getJSON('http://localhost:3001/todo').then((data) => {
       // How would I load the data into the model here?
    });
  }
});

我如何将从成功的 ajax 调用中获得的数据加载到模型中？

我已经定义了一个组件来显示这样的待办事项：

<ul>
  {{#each model as |todo index|}}
    {{#link-to 'todo' todo.id}}<li>{{todo.title}}</li>{{/link-to}}
  {{/each}}
</ul>

这是 router.js:

Router.map(function() {
  this.route('todos');
  this.route('todo', { path: '/todo/:todo_id' })
});

Answer 1

您可以使用 pushPayload method and peekAll .

export default Ember.Route.extend({
  model() {
    return Ember.$.getJSON('http://localhost:3001/todo').then((data) => {
       this.get('store').pushPayload('todo',data);
       return this.get('store').peekAll('todo');
    });
  }
});

Answer 2

如果您不想使用 ember-data 就不要使用它：

export default Ember.Route.extend({
  model() {
    return Ember.RSVP.resolve(Ember.$.getJSON('http://localhost:3001/todo'));
  }
});

这将按预期工作，让您可以访问 model 下返回的 JSON。因此，对于您的模板，只需确保 http://localhost:3001/todo 发送这样的 JSON：

[{
    "id": "a",
    "title": "foo"
}]

Answer 3

export default Ember.Route.extend({
    model() {
        return Ember.$.getJSON('http://localhost:3001/todo').then((data) => {
           return Ember.Object.create(data);
        });
    }
});

在 Emberjs 中成功调用 ajax 后如何加载 ember 模型？

How can I load ember model after successful ajax call in Emberjs?

javascript

ajax

ember.js