Facing issue in using ember-light-table

Learning Team
1

am learning ember js and I came across ember-light-table as an alternative of data-tables.

I just want to display some static data into table. So instead of creating mixin and component, I am writing code directly into route file. (Not sure things will work in this way or not).

Below is my route file

import Route from '@ember/routing/route';
import Table from 'ember-light-table';
import { computed } from '@ember/object';

export default Route.extend({
  table : null,
  columns: computed(function() {
    return [{
      label: 'Email',
      valuePath: 'email'
    }, {
      label: 'Name',
      valuePath: 'name'
    }];
  }),

  rows: computed(function() {
    return [{
      "email":"abc@gmail.email",
      "name":"Abc"
    }, {
        "email":"xyz@gmail.email",
        "name":"Xyz"
    }];
  }),

  init(){
    this._super(...arguments);
    let table = new Table(this.get('columns'),this.get('rows'));
    console.log("table = ",table);
    this.set('table', table);
  }
});

Template file

{{#light-table table height='65vh' as |t|}}
    {{t.head fixed=true }}

    {{#t.body canSelect=false as |body| }}
    {{/t.body}}
{{/light-table}}

I am getting below error in console:

Error: Assertion Failed: [ember-light-table] table must be an instance of Table

I have seen code of document and other blog also, code seems identical, but not sure Am I missing something or not.

Thanks in advance.

2

Think you’ll want to move all that code to your controller, or at least do it in the setupController hook in your route and set it all on the controller that way. If you define those props on the route the template doesn’t have access to them.