Fable Simple Table Sorting & Filtering for AngularJS

Fable is an AngularJS module that provides basic functionality for interactive tables. Fable allows you to sort by columns, as well as filter rows.

Fable aims to be as lighweight as possible; use of $scope.$watch is avoided - rather, Fable waits for user-triggered events (i.e. click) for sorting, or a MutationRecord for filtering.

Installation

Usage

1. Add the attribute fable="items" to your table element, where items is an array of objects you wish to display as rows.
2. Add the attribute fbl-sort="foo" to a table header column th that you would like to be able to sort by, where foo is a property of each item in items.
3. Add the attribute fbl-filter="bar" to an input element whose value represents the value of the property bar, that you would like to filter by.
   
   Alternatively, set an additional attribute fbl-filter-val to an expression that represents the value of bar to filter by, when evaluated in the current scope.
4. Your sorted and filtered items will be available as fblItems within the scope of the table.
   
   If the size of items changes at any point, call fblReView() from within the scope of the table.

Example