Upgrade ember-models-table to version 2

239 changed files with 15,200 additions and 3,878 deletions.

Ember-developers recommend using components rather than partial-templates long enough. Before ember@2.15 partial-components worked very good and without any problem. However bug {{link-to}} inside a partial stopped working has happened and ember-models-table addon became unusable. This served as a catalyst for refactoring the table and releasing a new major version.


  • All partials inside a models-table were replaced with components
  • models-table now may be used with a block content
  • New “themes”-mechanism is used for component styling

You may install new addon version executing next command:

ember install ember-models-table@2

Basic component usage wasn’t changed. You steel need to provide two attributes – data and columns:

{{models-table data=model columns=columns}}
{{models-table-server-paginated data=model columns=columns}}

Some component attributes were changed or totally removed. They are presented in the table below:

v 1.x v 2.x
expandedRowTemplate expandedRowComponent You have to provide a component name and not a path to template
customIcons themeInstance Icons and classes are combined into theme (check docs and small theming guide)
Each template listed bellow now is replaced with a proper component. For 1.x version you have to provide a path for template. For 2.x version you may override needed component or use block content. Once again, below the presented properties from the 1.x don’t exist in the 2.x.
simplePaginationTemplate components/models-table/pagination-simple API docs
numericPaginationTemplate components/models-table/pagination-numeric API docs
tableFooterTemplate components/models-table/table-footer API docs
componentFooterTemplate components/models-table/footer API docs
pageSizeTemplate components/models-table/page-size-select API docs
globalFilterTemplate components/models-table/global-filter API docs
columnsDropdownTemplate components/models-table/columns-dropdown API docs
noDataShowTemplate components/models-table/no-data API docs
rowTemplate components/models-table/row API docs
allColumnsHiddenTemplate components/models-table/columns-hidden API docs
headerSortingRowTemplate components/models-table/row-sorting API docs
headerFilteringRowTemplate components/models-table/row-filtering API docs
headerGroupedRowsTemplate components/models-table/grouped-header API docs

List options stay without changes:

columnSets, groupedHeaders, multipleColumnsSorting, useNumericPagination, showComponentFooter,
pageSize, showColumnsDropdown, useFilteringByColumns, filteringIgnoreCase, showGlobalFilter,
focusGlobalFilter, doFilteringByHiddenColumns, displayDataChangedAction, sendDisplayDataChangedAction,
columnsVisibilityChangedAction, sendColumnsVisibilityChangedAction, columnsAreUpdateable,
columnFieldsToCheckUpdate, showPageSize, multipleExpand, selectRowOnClick, multipleSelect,
preselectedItems, customMessages

You can find their description in the docs for models-table.

columns elements in 1.x have about 20 options. Almost all of them are available in the 2.x. Only three options were removed:

  • template. You should use component
  • templateForFilterCell. You should use componentForFilterCell
  • templateForSortCell. You should use componentForSortCell

component, componentForFilterCell и componentForSortCell exist in the 1.x too. They receive changed set of attributes in the 2.x. First of all, models-table is not passed to no one of them. Docs for models-table-column contain description for all attributes passed to it (check link).

Set of usage examples is available on the demo-page. Their source code is in the repo with addon (check here).

, , ,

Add comment

Top ↑ | Main page | Back