Add sort functionality to table Component

Added optional sort function to the shared table component.
Table sort is not implemented on any existing table, but will
be used in the redesigned Event Log table.

- Changed table model attribute to two separate properties
  data and header to take advantage of $onChanges lifecycle
  hook
- Update local user table and user role table to account for
  these updates

Tested on Chrome, Safari, Firefox, Edge, IE

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I4fe68e78ae9d1228d7d9350538f61076036b1089
diff --git a/app/users/directives/role-table.js b/app/users/directives/role-table.js
index ee99a41..c23fed8 100644
--- a/app/users/directives/role-table.js
+++ b/app/users/directives/role-table.js
@@ -20,9 +20,10 @@
           const check =
               $sce.trustAsHtml(`<span class="icon__check-mark">${svg}<span>`);
 
-          this.tableModel = {};
-          this.tableModel.header =
-              ['', 'Admin', 'Operator', 'User', 'Callback'];
+          this.tableHeader = [
+            {label: ''}, {label: 'Admin'}, {label: 'Operator'}, {label: 'User'},
+            {label: 'Callback'}
+          ];
 
           // TODO: When API changed from D-Bus to Redfish, 'Operator' role
           // should have 'Configure components managed by this service'
@@ -30,7 +31,7 @@
           // TODO: When 'Operator' and 'User' roles have ability to change
           // own account's passwords, should have 'Update password for
           // current user account' privilege checked
-          this.tableModel.data = [
+          this.tableData = [
             {
               uiData: [
                 'Configure components managed by this service', check, '', '',