尝试使用 Ember 中的记录时内容未定义答案

【问题标题】：Content is undefined when trying to work with a record in Ember尝试使用 Ember 中的记录时内容未定义
【发布时间】：2016-07-19 21:57:11
【问题描述】：

我正在尝试更新 Ember 商店中的记录。当我尝试这样做时，它会返回以下错误：

未捕获的错误：断言失败：无法将 set('name', test) 委托给对象代理的 'content' 属性：它的 'content' 未定义。

控制器如下所示：

import Ember from 'ember';

export default Ember.Controller.extend({
  model: null,
  event: {
    name: "test",
    id: "adfg8943224xcvsdf"
  },
  actions: {
    editEvent (event) {
      var Event = this.store.find('event', event.id);

      Event.set('name', event.name);
      Event.save()
    }
  }
});

路线如下：

import Ember from 'ember';

export default Ember.Route.extend(AuthenticatedRouteMixin, {
  model () {
    return {
      event: this.store.find('event')
    }
  },
  setupController (controller, model) {
    controller.set('model', model);
  }
});

模板触发动作，发送一个名为 event 的对象，该对象具有 name 和 id 等属性。事件对象的值来自控制器，并且在触发 editEvent 动作之前已经设置：

<form {{action 'editEvent' event on="submit"}}>

【问题讨论】：

find 不返回承诺吗？另外，请向我们展示模板代码，尤其是您调用editEvent 操作的部分——event 到底是什么？
Find 返回一个类，里面有一个内容类。 Event 是一个具有 name 和 id 等属性的对象。
你的意思是从模型钩子返回一个 POJO 吗？通常你会返回一个承诺。你为什么将store.find 包裹在这样的对象中？您是否尝试加载多个模型？

标签： javascript ember.js ember-data ember-cli

【解决方案1】：

我相信正在发生的事情是您的 model 钩子正在返回一个 POJO，其中包含将解决的承诺。如果您想将其传递给您的操作，那么您需要这样做

<form {{action 'editEvent' model.event on="submit"}}>

话虽如此，您实际上应该只从您的 model 挂钩返回一个承诺，以便 Ember 在渲染模板之前等待您的数据加载。以您现在设置的方式，如果您的数据需要很长时间才能加载，有人可能会在模型加载之前提交表单，您会收到错误消息。

我认为您希望您的路线看起来像这样（无需覆盖setupController）：

import Ember from 'ember';

export default Ember.Route.extend(AuthenticatedRouteMixin, {
  model () {
    return this.store.find('event');        
  }
});

然后在你的模板中：

<form {{action 'editEvent' model on="submit"}}>

如果您需要加载多个模型，那么您应该使用Ember.RSVP.hash。

看到这个答案：EmberJS: How to load multiple models on the same route?

另外，我不太确定您的操作要做什么，但您不需要再次查找记录。您为您的操作发布的代码实际上并没有做任何事情。它获取事件，然后将事件的名称设置为它自己的名称。

  actions: {
    editEvent (event) {
      // you already have the event, you passed it in as a parameter
      // you don't need to query the store again for it. 
      var Event = this.store.find('event', event.id);

      // This doesn't do anything as it just sets the event.name to itself
      Event.set('name', event.name);
      Event.save()
    }
  }

我认为你的意思是这样做：

  actions: {
    editEvent (event) {
      event.set('name', 'updated name');
      event.save();
    }
  }

【讨论】：