我有以下设置：
| // IndexController contains array of search result objects
| IndexController (ArrayController)
| //Contains a search result object with row data (array) and search metadata
|---> ResultController (ObjectController)
| // Contains just the row data which is rendered into a sortable table
|--------> TableController (ArrayController)
该IndexController检索从用户发起搜索的服务器对象的列表。返回的每个对象都有一些有关搜索的元数据以及所有行数据。
每个对象都是使用{{#each}}Index模板中的帮助器呈现的：
{{#each itemController="result"}}
{{view App.ResultView}}
{{/each}}
ResultView呈现元数据，然后使用如下{{render}}帮助器呈现实际表：
<h2>{{pieceofMetaData}}</h2>
{{render "table" rows}}
由于我指定了模型（在本例中为行数据），因此{{render}}助手为每个结果对象创建TableController的实例。例如，如果IndexController模型中有3个结果对象，则将创建3个TableController。TableController是一个ArrayController，可以利用ArrayController可以为我做的排序。在表格模板中，我渲染表格本身：
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
</tr>
</thead>
<tbody>
{{#each}} <!-- Each row of data is rendered here -->
<tr>
<td>{{firstName}}</td>
<td>{{lastName}}</td>
</tr>
{{/each}}
</tbody>
</table>
这很好用，但是我现在遇到了一个问题。我需要能够在访问属性ResultController从里面TableController。基本上，ResultController包含有关哪些列可排序的信息。我不知道如何ResultController从孩子那里访问父母TableController。
我尝试needs: ['result']在“ TableController”内部使用，但这只是实例化的新实例，ResultController而不是让我访问实际的父级。
我在下面创建了一个可工作的jsbin，用于设置我在此描述的代码。
任何帮助或建议，将不胜感激！
最好，
萨鲁斯
在您的情况下，我将使用PersonTableComponent，检查示例。使用渲染帮助器通常用于特定的路线上下文中。我认为，您正在尝试利用Ember.SortableMixin提供的'sortProperties'，'sortAscending'功能的优点，不幸的是，此mixin似乎仅适用于ArrayProxy实例，因此您需要在组件中实现排序功能。
<script type="text/x-handlebars" data-template-name="components/person-table">
<h3>{{header}} )</h3>
<table>
<thead>
<tr>
<th {{action 'toggleSortFirstName' }}>First Name</th>
<th {{action 'toggleSortLastName'}}>Last Name</th>
</tr>
</thead>
<tbody>
{{#each sortedPeople}}
<tr>
<td>{{firstName}}</td>
<td>{{lastName}}</td>
</tr>
{{/each}}
</tbody>
</table>
</script>
<script type="text/x-handlebars" data-template-name="index">
{{#each controller}}
{{person-table header=header people=rows}}
{{/each}}
</script>
App.PersonTableComponent = Ember.Component.extend({
sortProperty: 'lastName',
sortAscending: true,
sortedPeople: Em.computed(function(){
// define your sorting functionality
return this.get('people').sort( function(item) {
return -1;
});
}).property('people.@each', 'sortProperty', 'sortAscending'),
actions: {
toggleSortFirstName: function() {
var sortValue = !this.get('firstNameSortValue');
// save current sort state
this.set('fistNameSortValue', sortValue);
this.setProperties({sortProperty: 'firstName',
sortAscending: sortValue});
},
toggleSortLastName: function() {
var sortValue = !this.get('lastNameSortValue');
// save current sort state
this.set('lastNameSortValue', sortValue);
this.setProperties({sortProperty: 'lastName',
sortAscending: sortValue});
}
}
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句