javascript - Ember 数据 - 从子项中获取父项值

Question

我有一个具有浅层父子关系的小部件模型。给定的小部件可能是“根”小部件并且没有任何父部件，或者它可能是具有父部件的子部件。

ember 数据模型如下所示:

export default DS.Model.extend({
  name:         DS.attr('string'),
  parentWidget: DS.belongsTo('widget', { async: true, inverse: null }),
  isSubWidget:  DS.attr('boolean')
})

我正在尝试添加一个“displayName”属性，它将显示根小部件的名称，或子小部件的“父名称 - 子名称”

displayName: Ember.computed('name', 'parentWidget.name', 'isSubLob',  function() {
  if this.get('isSubWidget') {
    return "#{this.get('parentWidget.name')} - #{@get('name')}"
  }
  else {
    return "#{this.get('name')}"
  }
})

然而，这是行不通的。子 lob 的 displayName 总是以

undefined - WidgetName

返回的 json 是这样的:

{
"widgets": [
  {
    "id": 2,
    "name": "Widget Name",
    "is_sub_widget": true,
    "parent_widget_id": 1
  },
  ...
}

对于记录，所有记录都在同一时间由 json 返回。

我觉得 Ember 应该 异步解析父窗口小部件并且字符串也应该更新，但它似乎不起作用。知道我在这里做错了什么吗？

Answer 1

我会说你有两个问题:

1. 您没有声明您的 parentWidget 关系的逆关系，这意味着 Ember Data 正在猜测逆关系(并且可能猜错了)。您应该将该声明更改为如下所示，以确保:

   parentWidget: DS.belongsTo('widget', { async: true, inverse: null }),
   

   我怀疑这会解决您的问题，但这是一个很好的做法。

2. 在尝试使用该名称之前，您不会等待您的 promise 得到解决。您已将 parentWidget 关系指定为异步关系，这意味着 @get('parentWidget') 将不返回模型。它将返回一个最终将解析为您的模型的 promise 。通常这会很好，因为计算属性只会在 promise 解析时重新计算，除非您没有注意正确的键。

   /* PS: Assuming that your comma was misplaced on this line */
   displayName: Ember.computed('name', 'parentWidget', function() {
                                        ^^^^^^^^^^^^
   

   如上所示，您只关注 parentWidget 属性。因此，如果 parentWidget 上的 name 属性每次更新，您都不会收到通知。将该行更改为此，您应该可以开始了:

   displayName: Ember.computed('name', 'parentWidget.name', function() {
   

   请记住，前几次 parentWidget.name 仍将是 undefined。在 promise 解析之前，它不会是您想要的值，这意味着计算属性在解析之前可以运行多次。