如何使用Ember Data來表示模型樹？

我正在尋找一種方法來從Ember模型生成D3.js數據結構，將我現有的應用程序轉換爲Ember。目標是顯示一個任務樹，每個任務有0個或更多的子任務。如何使用Ember Data來表示模型樹？

這裏是我想喂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() 
});

但是，我得到一個「最大調用堆棧大小超過「錯誤。看起來從data屬性調用this導致它在無限循環中再次被調用。

如果我爲孩子返回一個空數組，所有工作正常。

你知道我爲什麼這麼做嗎？這是另一種方式嗎？

來源

2013-11-09 Renaud Chaput

在您的示例中存在拼寫錯誤「thisi」。見模型。 –

謝謝，修復！ –

data已經在DS.Model屬性，想必它越來越通過get小號...現在正在進入你的data重新定義，並造成你的循環調用。

來源

2013-11-10 15:02:40

謝謝，我錯過了！我將該屬性重命名爲d3data，並且一切正常。 –

我認爲你最好使用關聯，不是嗎？嘗試使用自引用數據結構。

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

希望有幫助。這種取決於你想用這些東西來做什麼，但這正是我在構建基於樹的數據結構時通常使用的。

來源

2013-11-13 05:47:36

如何使用Ember Data來表示模型樹？

回答

相關問題