From 4addf0fb73c09e454e68f115c4d637ca4b3855bd Mon Sep 17 00:00:00 2001
From: Denys Vuika <denis.vuyka@gmail.com>
Date: Wed, 2 Aug 2017 11:44:19 +0100
Subject: [PATCH] Optional automatic translation of column headers (#2166)

---
 ng2-components/ng2-alfresco-datatable/README.md  | 16 +++++++++++++++-
 .../datatable/datatable.component.html           |  2 +-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/ng2-components/ng2-alfresco-datatable/README.md b/ng2-components/ng2-alfresco-datatable/README.md
index 11d1acd21e..ed59118375 100644
--- a/ng2-components/ng2-alfresco-datatable/README.md
+++ b/ng2-components/ng2-alfresco-datatable/README.md
@@ -173,7 +173,7 @@ Here's the list of available properties you can define for a Data Column definit
 | type | string (text\|image\|date) | text | Value type |
 | format | string | | Value format (if supported by components), for example format of the date |
 | sortable | boolean | true | Toggles ability to sort by this column, for example by clicking the column header |
-| title | string | | Display title of the column, typically used for column headers |
+| title | string | | Display title of the column, typically used for column headers. You can use the i18n resouce key to get it translated automatically. |
 | template | `TemplateRef` | | Custom column template |
 | sr-title | string | | Screen reader title, used for accessibility purposes |
 | class | string | | Additional CSS class to be applied to column (header and cells) |
@@ -218,6 +218,20 @@ onRowClick(event) {
 
 ![](docs/assets/datatable-dom-events.png)
 
+### Automatic column header translation
+
+You can also use i18n resource keys with DataColumn `title` property.
+The component will automatically check the corresponding i18n resources and fetch corresponding value.
+
+```html
+<data-column
+    key="name"
+    title="MY.RESOURCE.KEY">
+</data-column>
+```
+
+This feature is optional. Regular text either plain or converted via the `translate` pipe will still be working as it was before.
+
 ### Custom Empty content template
 
 You can add a template that will be shown when there are no results in your datatable:
diff --git a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
index a5c3ffcd1f..f4c8bbeeae 100644
--- a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
+++ b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
@@ -20,7 +20,7 @@
             [class.adf-data-table__header--sorted-desc]="isColumnSorted(col, 'desc')"
             (click)="onColumnHeaderClick(col)">
             <span *ngIf="col.srTitle" class="sr-only">{{col.srTitle}}</span>
-            <span *ngIf="col.title">{{col.title}}</span>
+            <span *ngIf="col.title">{{ col.title | translate}}</span>
         </th>
         <!-- Actions (right) -->
         <th *ngIf="actions && actionsPosition === 'right'" class="actions-column">