1

我主要了解与路由、模板、控制器相关的 Ember 基础知识（或认为是这样），在简单的示例中很容易使用，但我不知道如何使用树状结构的好方法。

这是基本示例。假设我想显示 2 个待办事项列表（未完成和已完成）：

Incomplete

 1. Todo1
 2. Todo2

Complete

 1. TodoDone1
 2. TodoDone2

我知道 2 种方法如何在 Ember 中实现它

1）使用路由嵌套并在单独的模板、单独的模型中显示这些列表：

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

2) 使用计算机属性，过滤一个模型并返回列表以显示在一个模板中

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 回答