inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

datatable improvements (#1822)

Browse Source 
- move ngSwitch outside of the ngFor directive (to avoid issues)
- improved template maintainance (without ngFor template hack)
- readme updates to reflect new features
This commit is contained in:
Denys Vuika
2017-04-19 15:41:47 +01:00
committed by Mario Romano
parent 6c2e56296f
commit 87b479e720
3 changed files with 94 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
View File

@@ -53,33 +53,38 @@
<td *ngIf="multiselect">
<md-checkbox [(ngModel)]="row.isSelected"></md-checkbox>
</td>
<td *ngFor="let col of data.getColumns()" [ngSwitch]="col.type"
<td *ngFor="let col of data.getColumns()"
class="mdl-data-table__cell--non-numeric non-selectable data-cell {{col.cssClass}}"
(click)="onRowClick(row, $event)"
(dblclick)="onRowDblClick(row, $event)"
[context-menu]="getContextMenuActions(row, col)"
[context-menu-enabled]="contextMenu">
<div *ngIf="!col.template" class="cell-container">
<div *ngSwitchCase="'image'" class="cell-value">
<i *ngIf="isIconValue(row, col)" class="material-icons icon-cell">{{asIconValue(row, col)}}</i>
<img *ngIf="!isIconValue(row, col)"
class="image-cell"
alt="{{iconAltTextKey(data.getValue(row, col))|translate}}"
src="{{data.getValue(row, col)}}"
(error)="onImageLoadingError($event)">
</div>
<div *ngSwitchCase="'date'" class="cell-value" [attr.data-automation-id]="'date_' + data.getValue(row, col)">
{{data.getValue(row, col)}}
</div>
<div *ngSwitchCase="'text'" class="cell-value" [attr.data-automation-id]="'text_' + data.getValue(row, col)">
{{data.getValue(row, col)}}
</div>
<span *ngSwitchDefault class="cell-value">
<!-- empty cell for unknown column type -->
</span>
<ng-container [ngSwitch]="col.type">
<div *ngSwitchCase="'image'" class="cell-value">
<i *ngIf="isIconValue(row, col)" class="material-icons icon-cell">{{asIconValue(row, col)}}</i>
<img *ngIf="!isIconValue(row, col)"
class="image-cell"
alt="{{iconAltTextKey(data.getValue(row, col))|translate}}"
src="{{data.getValue(row, col)}}"
(error)="onImageLoadingError($event)">
</div>
<div *ngSwitchCase="'date'" class="cell-value" [attr.data-automation-id]="'date_' + data.getValue(row, col)">
{{data.getValue(row, col)}}
</div>
<div *ngSwitchCase="'text'" class="cell-value" [attr.data-automation-id]="'text_' + data.getValue(row, col)">
{{data.getValue(row, col)}}
</div>
<span *ngSwitchDefault class="cell-value">
<!-- empty cell for unknown column type -->
</span>
</ng-container>
</div>
<div *ngIf="col.template" class="cell-container">
<template ngFor [ngForOf]="[{ data: data, row: row, col: col }]" [ngForTemplate]="col.template"></template>
<ng-container
[ngTemplateOutlet]="col.template"
[ngOutletContext]="{ $implicit: { data: data, row: row, col: col }, value: data.getValue(row, col) }">
</ng-container>
</div>
</td>