angulartypescriptng2-smart-table

Ng2-smart-table cell background color depending on content


I'm using the module Ng2-smart-table (https://akveo.github.io/ng2-smart-table/#/documentation).

Is it possible to customize the background of a cell / or entire row depending of the content of the same cell / or a cell of the same row? Can you provide an example?

Thank you


Solution

  • I figured it out:

    import { Component, Input, OnInit } from '@angular/core';
    import { ViewCell } from 'ng2-smart-table';
    
    
    @Component({
      template: `
      <span [ngClass]="classToApply">{{renderValue}}</span>
      `,
      styles: ['.error { color: red; }']
    })
    export class MyColumnRenderComponent implements ViewCell, OnInit {
    
      renderValue: string;
    
      @Input() value: string | number;
      @Input() rowData: any;
    
      classToApply = '';
    
      ngOnInit() {
        if(this.value == 'MY_ERROR_CODE') {
          this.classToApply = 'error';
        }
        this.renderValue = this.value.toString().toUpperCase();
      }
    
    }