1

ルート、テンプレート、コントローラーに関連する Ember の基本 (またはそう思う) はほとんど理解しています。単純な例では簡単に使用できますが、ツリーのような構造を操作する方法がわかりません。

これが基本的な例です。Todo アイテムの 2 つのリスト (未完了と完了) を表示したいとします。

Incomplete

 1. Todo1
 2. Todo2

Complete

 1. TodoDone1
 2. TodoDone2

Emberでそれを実装する方法を2つ知っています

1) ルートのネストを使用し、これらのリストを個別のテンプレート、個別のモデルで表示します。

App.Router.map(function() {
    this.resource('todo', function() {
        this.route('todocompleted');
    });
});

2) 1 つのモデルをフィルタリングし、1 つのテンプレートで表示するためのリストを返すコンピューター プロパティの使用

App.TodoController = Ember.ArrayController.extend({
    todoIncoplete: function() {
        // filter model and return list
    }.property('model.@each'),
    todoComplete: function() {
        // filter model and return list
    }.property('model.@each'),
});

それは正しい実装ですか？または何かアドバイスをいただけますか？

4

1 に答える 1

0

プロジェクトで ember が提供する組み込みメソッド、ヘルパーを使用するようにしてください。あなたの場合each、テンプレートでヘルパーを使用することが、ember コーディングの最良の方法になります。

App = Ember.Application.create({});

App.TodoController = Ember.ObjectController.extend({
    incomplete : ['Todo1','Todo2'],
    completed : ['TodoDone1','TodoDone2']
});

ハンドルバー テンプレート コード:

Incomplete:
<ol>
 {{#each task in incomplete}}
   <li>{{task}}</li>
 {{/each}}
</ol>  
Complete:
<ol>
 {{#each task in completed}}
   <li>{{task}}</li>
 {{/each}}
</ol>

jsbinの実際の例を次に示します。

于 2013-12-09T12:06:54.593 に答える