title: Text Color for different status Angular 6
body: <p>I have a view on angular just like this:</p>
  
  <p><a href="https://i.stack.imgur.com/JimWN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JimWN.png" alt="enter image description here"></a></p>
  
  <p>And this is my dashboard.component.ts:</p>
  
  <pre><code> export class DashboardComponent implements OnInit {
   tablePresetColumns;
   tablePresetData;
   ngOnInit() {
     this.tablePresetColumns = [{id: 1,content: 'Username'},{id: 2,content: 'Status'}];
     this.tablePresetData = [[{id: 1,content: 'john.doe@random.com'},{id: 2,content: 'Busy'}],[{id: 1,content: 'test2@random.com'},{id: 2,content: 'overload'}]];
    }
   } 
  </code></pre>
  
  <p>And this is the way i call the table on dashboard.component:</p>
  
  <pre><code>&lt;div eds-tile class="xl-4" style="height: 700px"&gt;
      &lt;eds-tile-title&gt;User on Shift&lt;/eds-tile-title&gt;  
      &lt;eds-table [columns]="tablePresetColumns" [data]="tablePresetData" [modes]="['compact', 'dashed']"&gt;&lt;/eds-table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>eds-table:</p>
  
  <pre><code>selector: 'eds-table',
  template: "&lt;table class=\"table\" [ngClass]=\"modes\"&gt;\n  &lt;thead *ngIf=\"columns\"&gt;\n    &lt;tr&gt;\n      &lt;th *ngFor=\"let col of columns\"&gt;\n        {{col.content}}\n      &lt;/th&gt;\n    &lt;/tr&gt;\n  &lt;/thead&gt;\n  &lt;tbody&gt;\n    &lt;tr *ngFor=\"let row of data\"&gt;\n      &lt;td *ngFor=\"let cell of row\"&gt;\n        {{cell.content}}\n      &lt;/td&gt;\n    &lt;/tr&gt;\n  &lt;/tbody&gt;\n&lt;/table&gt;\n",
  </code></pre>
  
  <p>What should I do, if I want to give some color on Status, I mean there are conditions when status Busy, the text Color change green, or Idle change  Yellow, and Overload change into Red.</p>
  
  <p>Help me, guys...
  Thanks,</p>