ember-table icon indicating copy to clipboard operation
ember-table copied to clipboard

cellComponent not working with Octane components

Open justin-ad opened this issue 4 years ago • 1 comments

cellComponent doesn't appear to be working with Ember Octane components:

routes/mytable.js

model = { 
  columns: [
  {
    name: "Foo",
    valuePath: "foo"
  }, {
    name: "Test",
    cellComponent: 'test'
  }
],
rows: [
  {
    "foo": "This is a test",
  }
]}

components/test.hbs

<p>Testing component</p>

templates/mytable.hbs

<EmberTable as |t|>
       <t.head 
          @columns={{@model.columns}} 
          @enableResize={{true}} 
          @enableReorder={{false}} 
          @sorts={{@model.sorts}}
          @onUpdateSorts={{action (mut @model.sorts)}} />
       <t.body @rows={{model.rows}} />
</EmberTable>

This results in the table rendering as expected, with the first column displaying "This is a test" as expected, but nothing appearing in the second column with the cellComponent.

justin-ad avatar Jul 09 '20 20:07 justin-ad

@jtwolgamott I dont believe there is support for cellComponent built in. From the docs you can use your column definition to use the component helper in the template directly:

<EmberTable as |t|>
    <t.head 
        @columns={{@model.columns}} 
        @enableResize={{true}} 
        @enableReorder={{false}} 
        @sorts={{@model.sorts}}
        @onUpdateSorts={{action (mut @model.sorts)}} />

        <t.body @rows={{model.rows}} as |b|>
            <b.row as |r|>
                <r.cell as |cell column row|>
                    {{component column.cellComponent row=row}}
                </r.cell>
            </b.row>
        </t.body>

</EmberTable>

kylenathan avatar Oct 28 '20 15:10 kylenathan