Question

我正在寻找一种从Ember模型生成D3.js数据结构的方法，将我现有的应用程序转换为Ember。目标是显示一个任务树，每个任务都有0个或更多子任务。

以下是我想要提供给D3.js的结果：

[
  {
    "parent": 429,
    "name": "Parent task 1",
    "id": 428
    "children": [
      {
        "parent": 428,
        "name": "Sub task 1",
        "id": 425
      },
      {
        "parent": 428,
        "name": "Sub task 2",
        "id": 426
      }
    ]
  },
  ...
]

我试图像这样定义我的模型：

Minp.Task = DS.Model.extend({
  name: DS.attr(),
  subtasks: DS.hasMany('task'),
  data: Ember.computed(function () {
    return {
      id: this.get('id'),
      name: this.get('name'),
      type: 'task',
      children: this.get('subtasks').map(function (task) {
        return task.get('data');
      })
    };
  }).property()
});

但是我收到了“超出最大调用堆栈大小”错误。似乎从this属性调用data会导致在无限循环中再次调用它。

如果我为孩子们返回一个空数组，一切正常。

你知道我为什么会这样吗？这是另一种方式吗？

Answer 1

我认为你最好不要使用协会，不是吗？尝试使用自我引用的数据结构。

Minp.Task = DS.Model.extend({
  parent: DS.belongsTo('task', inverse: 'children');
  children: DS.hasMany('task', async: true, inverse: 'parent');
});

希望这会有所帮助。这取决于你想用这些东西做什么，但这是我在构建基于树的数据结构时通常使用的。

Answer 2

data已经是DS.Model上的一个属性，并且可能是通过get调用它...现在正在重新定义data，并导致你的循环。

如何使用Ember Data表示模型树？

2 个答案: