some-component.hbs

<table {{bind-attr class="tableClassNames"}}>
	<thead>
	<tr>
		{{#each header in tableHeaders}}
			{{#if header.sortKey}}
				<th {{action "sortBy" header.sortKey}} {{bind-attr class="header.classNames header.sortKey:sorting"}}>{{header.title}}</th>
			{{else}}
				<th {{bind-attr class="header.classNames"}}>{{header.title}}</th>
			{{/if}}
		{{/each}}
	</tr>
	</thead>
	<tbody>
		{{yield rows}}
	</tbody>
</table>

some-component.js

import Ember from 'ember';

export default Ember.Component.extend(Ember.SortableMixin, {
	sortProperties: ['id'],
	sortAscending: true,

	tableClassNames: 'table table-striped table-hover',

	headers: [
		{
			sortKey: 'objectKey',
			title: 'Title',
			classNames: 'td-class-names'
		}
	],

	init: function() {
		this._super();

		// todo: first header could be unsortable
		var firstHeader = this.get('headers')[0];
		this.set('sortProperties', [firstHeader.sortKey]);
	},

	tableHeaders: function() {
		// todo could be written better
		var headers = this.get('headers');
		var sortProperty = this.get('sortProperties')[0];
		var sortAscending = this.get('sortAscending');

		var sorting = (sortAscending) ? 'sorting_asc' : 'sorting_desc';

		var tableHeaders = [];

		headers.forEach(function(header) {
			var sortingClassName = (sortProperty === header.sortKey) ? sorting : '';

			tableHeaders.push({
				sortKey: header.sortKey,
				title: header.title,
				classNames: header.classNames + ' ' + sortingClassName
			});
		});

		return tableHeaders;
	}.property('sortProperties', 'sortAscending'),

	rows: function() {
		return this.get('arrangedContent');
	}.property('sortProperties', 'sortAscending'),

	actions: {
		sortBy: function(property) {
			if (property === this.get('sortProperties')[0]) {
				this.set('sortAscending', !this.get('sortAscending'));
			} else {
				this.set('sortAscending', true);
				this.set('sortProperties', [property]);
			}
		}
	}
});

{{#some-component content=model as |rows|}}
  {{#each row in rows}}
    do stuff
  {{/#each}}
{{/some-component}}