nts-ng2-components
Version:
Paquete de componentes para Angular2 desarrollado por NITSNETS.
48 lines (45 loc) • 2.15 kB
HTML
<ng-container *ngIf="!customCell">
<span class="datagrid-cell-label" *ngIf="showLabels">{{label}}:</span>
<ng-container *ngIf="value" [ngSwitch]="format">
<ng-container *ngSwitchCase="'void'"> {{value}} </ng-container>
<strong class="datagrid-cell-value" *ngSwitchCase="'strong'">{{value}}</strong>
<span class="datagrid-cell-value" *ngSwitchCase="'span'">{{value}}</span>
<p class="datagrid-cell-value" *ngSwitchCase="'p'">{{value}}</p>
<h1 class="datagrid-cell-value" *ngSwitchCase="'h1'">{{value}}</h1>
<h2 class="datagrid-cell-value" *ngSwitchCase="'h2'">{{value}}</h2>
<h3 class="datagrid-cell-value" *ngSwitchCase="'h3'">{{value}}</h3>
<h4 class="datagrid-cell-value" *ngSwitchCase="'h4'">{{value}}</h4>
<div class="datagrid-cell-value" *ngSwitchCase="'html'" [innerHtml]="value"></div>
<img
class="datagrid-cell-value"
alt="Cell image"
*ngSwitchCase="'image'"
[src]="value"
>
<nts-progress
class="datagrid-cell-value"
*ngSwitchCase="'progress'"
[value]="value"
[color]="options?.color"
[total]="options?.total"
></nts-progress>
<nts-badge class="datagrid-cell-value"
*ngSwitchCase="'badge'"
[label]="value"
[color]="options?.color"
></nts-badge>
<!-- You can add a new format case this way: -->
<ng-container *ngSwitchCase="'yourCustomCase'">
The content of your custom cell.
The value of the cell is at {{value}} and the options at {{options}}
</ng-container>
<!---->
<span class="datagrid-cell-value" *ngSwitchDefault>
default {{value | format: format}}
</span>
</ng-container>
<ng-content *ngIf="!value"></ng-content>
</ng-container>
<ng-container *ngIf="customCell">
<ng-template [ngTemplateOutlet]="customCell" [ngOutletContext]="context"> </ng-template>
</ng-container>