使用 ember-models-table 中的模板

Question

我正在使用 ember-models-table (https://github.com/onechiporenko/ember-models-table)，我想自定义表格单元格的输出。正如文档所建议的那样，我尝试将模板和组件分配给列定义中的列。

import Ember from 'ember';

export default Ember.Controller.extend({
    columnDefs
    {
        "propertyName": "id",
        "title": "ID",
    },
    {
        "propertyName": "name",
        "title": "Name",
    },
    {
        "propertyName": "postTypeId",
        "title": "Post Type",
        "template": "ember-models-table/column/enumType", // can be template or component
    }
});

所以我不是在谈论 ember-models-table 组件，而是关于可以分配给特定列的自定义模板/组件，如我的代码片段中的第 3 列所示。虽然似乎只向模板传递了记录引用，但文档 (http://onechiporenko.github.io/ember-models-table/#/examples) 说向组件传递了表、列、记录和数据引用，但我需要的是

a) 我在控制器的 columnDefs 中定义的具体值（或模型属性）（这是因为我想使用这个模板/组件有许多模型和不同的属性名称，所以我不能硬编码属性名称在模板/组件中）

b) 将任意数据传递给列的组件的能力（这里我只是在谈论组件，因为组件似乎可以通过 data 属性传递一些东西，但我不知道该怎么做它）

希望我的问题越来越清楚，并感谢每一个建议。

P.S 如果有更好的方法来格式化表格单元格中的输出（例如，通过某种方式为单元格的值分配帮助器），请告诉我。

Answer 1

我可能误解了你的情况；但请看一下我在twiddle 中创建的虚拟应用程序。我已在自定义组件 (my-component) 的列定义中将 my-custom-property-for-component 和名为 tableWideCustomProperty 的表范围自定义属性传递给 models-table。

您可以从my-component 中检索这些属性，如下所示：

检索my-custom-property-for-component：column.my-custom-property-for-component，因为列定义以名称column 传递给自定义组件。

检索tableWideCustomProperty：table.tableWideCustomProperty，因为models-table 本身以名称table 传递给自定义组件。

如您所见，您可以访问列定义中定义的自定义组件中的table、record、data 和column 属性。

Answer 2

虽然我可能无法 100% 了解您的用例，但我假设在您的路线上呈现表格。一种方法是在控制器属性上定义列定义，并将其与模型一起传递给组件。

app/controllers/person.js

import Ember from 'ember';

export default Ember.Controller.extend({
columnDefs: [
    {
        "propertyName": "id",
        "title": "ID"
    },
    {
        "propertyName": "firstName",
        "title": "First Name"
    },
    {
        "propertyName": "lastName",
        "title": "Last Name"
    }]
});

app/models/person.js

import DS from 'ember-data';

export default DS.Model.extend({
    firstName:     DS.attr('string'),
    lastName:      DS.attr('string')
});

app/routes/person.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return this.store.findAll('person');
  }
})

app/templates/person.hbs

{{models-table
        data=model
       columns=columnDefs}}

您可以根据需要向对象添加任何选项（模板、排序依据等）。