Ember-CLI を使用して todo タイプのプロジェクトに取り組んでいます。私は気の利いた todoMVC プロジェクトを出発点として使用しましたが、このガイドを使用して Ember-CLI で構築しました。
http://blaketv.com/2014/10/03/ember-cli-todo-mvc-tutorial-0-0-47//
私の質問は、親レベルでプロジェクトを追加するにはどうすればよいかということです。そのため、マスター/詳細タイプのインターフェイスを用意し、サイドバーにプロジェクトを配置して、プロジェクト名を CRUD にできます。プロジェクト名をクリックすると、詳細ペインに Todo が表示されます。
モデルへの hasMany 関係を十分に定義できましたが、複数の {{outlets}} が必要かどうかわかりません。すべてを同じページにまとめて機能させるのは非常に困難です。
プロジェクトの私のモデルは次のとおりです。
export default DS.Model.extend({
title: DS.attr('string'),
isCompleted: DS.attr('boolean'),
description: DS.attr('string'),
todos: DS.hasMany('todo', {async: true})
});
todos のモデル:
import DS from 'ember-data';
export default DS.Model.extend({
title: DS.attr('string'),
isCompleted: DS.attr('boolean')
});
およびメインのルーター:
Router.map(function() {
this.resource('projects', function () {
this.route('new');
this.resource('project', { path: ':id' }, function () {
this.route('todos');
});
});
});
プロジェクトのルート:
export default Ember.Route.extend({
model: function(params) {
return this.store.find('project', params.id);
}
});
インデックス ルート:
export default Ember.Route.extend({
model: function() {
return this.store.find('project');
}
});
Todos ルート:
export default Ember.Route.extend({
model: function() {
return this.modelFor('todos');
}
});
したがって、project.hbs の場合、ここが難しいところです。ブートストラップでサイドバーを作成すると、このアウトレットに todo が表示されます....
<div class="projects-column col-md-3">
<div id="inbox-header"><span class="glyphicon glyphicon-inbox"></span> Inbox <span class="badge">42</span></div>
<div id="projects-header"><span class="glyphicon glyphicon-list-alt"></span> Projects</div>
<div id="forecast-header"><span class="glyphicon glyphicon-calendar"></span> Forecast</div>
<div id="log-header"><span class="glyphicon glyphicon-book"></span> Sessions Log</div>
</div>
<div>{{outlet}}</div>
Index.hbs:
<ul>
{{#each model}}
<li>{{link-to title "project.todos" this}}</li>
{{/each}}
上記のプロジェクト タイトル リンクをクリックすると、関連付けられた todo が表示されます....しかし、左側のペインにレンダリングされます...おそらく CSS レイアウトに関するものです...しかし、何かが非常にあることを教えてくれます私が行方不明になっているこれを行うためのエンバーっぽい方法。
次に/project/todo.hbs
、反復があります
{{#each model.todos}}
<li>{{title}}</li>
{{/each}}
コントローラーなどの CRUD を作成することについては、まだ触れていません。ほとんどの場合、これはばかげており、これにアプローチするはるかにエレガントな方法があります...
基本的に、CRUD を行うプロジェクトの親ルートが必要です。次に、サイドバーでプロジェクト リンクのリストをレンダリングして 1 つをクリックすると、レンダリングされた ToDoMVC 作業アプリが右側のペインに表示されます。
もちろん、これは私のアプリケーションの出発点にすぎません。誰かがこれを行うエレガントな方法を思いついた場合、他の人が学べるように、それを github のオープン ソース プロジェクトに変えることができます。
複数の方法 (アウトレット、パーシャル、レンダリング、他のテンプレート、ビュー、コンポーネントなどへのレンダリング) があるため、急成長中の ember 開発者の多くは、この種のことで苦労していると思います。
これ以上先に進む方法が本当にわかりません。