diff --git a/CHANGELOG.md b/CHANGELOG.md
index 05d3cfd..f0cbc74 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,11 @@
 #Changelog
 
+## 0.2.4 (2016-04-19)
+
+Bugfixes:
+
+    - add import for lodash in file `DataTable.ts`
+
 ## 0.2.3 (2016-03-21)
 
 Bugfixes:
diff --git a/examples/systemjs/index.html b/examples/systemjs/index.html
index a40acb0..8340ca6 100644
--- a/examples/systemjs/index.html
+++ b/examples/systemjs/index.html
@@ -7,13 +7,11 @@
     <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
     <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap-theme.min.css">
 
-    <script src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
     <script src="/node_modules/es6-shim/es6-shim.min.js"></script>
+    <script src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
     <script src="/node_modules/systemjs/dist/system.src.js"></script>
     <script src="/node_modules/angular2/bundles/http.min.js"></script>
 
-    <script src="node_modules/lodash/lodash.min.js"></script>
-
     <script>
         System.config({
             defaultJSExtensions: true,
@@ -21,7 +19,8 @@
                 "/angular2": {"defaultExtension": false}
             },
             map: {
-                'angular2-datatable': 'node_modules/angular2-datatable'
+                'angular2-datatable': 'node_modules/angular2-datatable',
+                'lodash': 'node_modules/lodash/lodash.js'
             }
         });
     </script>
diff --git a/examples/systemjs/package.json b/examples/systemjs/package.json
index 1dfba27..406cb76 100644
--- a/examples/systemjs/package.json
+++ b/examples/systemjs/package.json
@@ -19,7 +19,7 @@
     "bootstrap": "^3.3.6",
     "es6-shim": "^0.35.0",
     "lodash": "^4.6.1",
-    "mf-angular2-table": "0.0.1",
+    "angular2-datatable": "0.2.4",
     "reflect-metadata": "0.1.2",
     "rxjs": "5.0.0-beta.2",
     "systemjs": "^0.19.9",
diff --git a/examples/systemjs/src/app.html b/examples/systemjs/src/app.html
index 836a6ee..58395e3 100644
--- a/examples/systemjs/src/app.html
+++ b/examples/systemjs/src/app.html
@@ -17,7 +17,7 @@ <h2>Simple data table</h2>
                 <thead>
                 <tr>
                     <th style="width: 20%">
-                        <mfDefaultSorter by="name">Name</mfDefaultSorter>
+                        <mfDefaultSorter [by]="sortByWordLength">Name</mfDefaultSorter>
                     </th>
                     <th style="width: 50%">
                         <mfDefaultSorter by="email">Email</mfDefaultSorter>
@@ -47,5 +47,12 @@ <h2>Simple data table</h2>
                 </tfoot>
             </table>
         </div>
+
+        <div>
+            <label>Fruit</label>
+            <input #fruit>
+            <label>Price</label>
+            <input #price>
+        </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/examples/systemjs/src/app.ts b/examples/systemjs/src/app.ts
index 6c5c8e6..55a421d 100644
--- a/examples/systemjs/src/app.ts
+++ b/examples/systemjs/src/app.ts
@@ -27,6 +27,10 @@ export class App {
         return +num;
     }
 
+    private sortByWordLength = (a: any) => {
+        return a.name.length;
+    }
+
 }
 
 bootstrap(App);
\ No newline at end of file
diff --git a/mf-angular2-table/package.json b/mf-angular2-table/package.json
index 70f9a66..9088e9b 100644
--- a/mf-angular2-table/package.json
+++ b/mf-angular2-table/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular2-datatable",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "DataTable component for Angular2 framework",
   "main": "datatable",
   "scripts": {
diff --git a/mf-angular2-table/src/DataTable.ts b/mf-angular2-table/src/DataTable.ts
index 36ea45f..f9f150d 100644
--- a/mf-angular2-table/src/DataTable.ts
+++ b/mf-angular2-table/src/DataTable.ts
@@ -1,4 +1,5 @@
 import {Directive, Input, EventEmitter, SimpleChange, OnChanges, DoCheck} from "angular2/core";
+import * as _ from "lodash";
 
 export interface SortEvent {
     sortBy: string;