
Security News
Deno 2.2 Improves Dependency Management and Expands Node.js Compatibility
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
ember-table
Advanced tools
An addon to support large data set and a number of features around table. Ember Table
can
handle over 100,000 rows without and rendering or performance issue.
ember install ember-table
To use Ember Table
, you need to create columns
and rows
dataset.
columns
is an array of objects which has multiple fields to define behavior of column.
Two required field in each object is columnName
and valuePath
.
columns: [
{
columnName: `Open time`,
valuePath: `open`
},
{
columnName: `Close time`,
valuePath: `close`
}
]
rows
could be a javascript array, ember array or any data structure that implements length
and
objectAt(index)
. This flexibity gives application to avoid having all data at front but loads more
data as user scrolls. Each object in the rows
data structure should contains all fields defined
by all valuePath
in columns
array.
rows: computed(function() {
const rows = emberA();
rows.pushObject({
open: '8AM',
close: '8PM'
});
rows.pushObject({
open: '11AM',
close: '9PM'
});
return rows;
})
The following template renders a simple table.
{{#ember-table
rows=rows
columns=columns
as |row|
}}
{{#ember-table-row
row=row
as |cell|
}}
{{cell.value}}
{{/ember-table-row}}
{{/ember-table}}
To have your own custom cell, pass in the cell component name in each element of columns
array and
specify it in the template.
{{#ember-table
rows=rows
columns=columns
as |row|
}}
{{#ember-table-row
row=row
as |cell|
}}
{{#component cell.column.cellComponent
cell=cell
}}
{{/ember-table-row}}
{{/ember-table}}
The rendered table is a plain table without any styling. You can define styling for your own table.
If you want to use default table style, import the ember-table/default
SASS file.
FAQs
An addon to support large data set and a number of features around table.
The npm package ember-table receives a total of 12,185 weekly downloads. As such, ember-table popularity was classified as popular.
We found that ember-table demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 7 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
Security News
React's CRA deprecation announcement sparked community criticism over framework recommendations, leading to quick updates acknowledging build tools like Vite as valid alternatives.
Security News
Ransomware payment rates hit an all-time low in 2024 as law enforcement crackdowns, stronger defenses, and shifting policies make attacks riskier and less profitable.