Kendo Grid Angular 6在列中连续添加类

Question

I have below link.

https://stackblitz.com/edit/angular-pwq1rq-d4ymup?file=app/app.component.ts

import { Component } from '@angular/core';

import { Component, ViewEncapsulation } from '@angular/core';

@Component({
   selector: 'my-app',
   encapsulation: ViewEncapsulation.None,
   styles: [`
       tr .myClass {
           color: green
      }
   `],
   template: `
       <kendo-grid [data]="gridData" style="height: 200px">
         <kendo-grid-column field="ProductName" title="Product Name" width="200" [class]="{'myClass':  1 > 0}">
         </kendo-grid-column>
         <kendo-grid-column field="UnitPrice" title="Unit Price" width="230" [class]="{'myClass':  check(UnitPrice) }">
         </kendo-grid-column>
       </kendo-grid>
   `
})
export class AppComponent {
   public gridData: any[];

   constructor() {
       this.gridData = [{
           "ProductID": 1,
           "ProductName": "Chai",
           "UnitPrice": 18,
           "Discontinued": true
         }, {
           "ProductID": 2,
           "ProductName": "Chang",
           "UnitPrice": 10,
           "Discontinued": false
         }];
   }

   check(d:any){
     console.log(d)
     if( d > 10) 
      return true 
      else 
      return false

   }
}

Need to add class on condition, also Unable to find how to add else part there

Thanks

Answer 1

You can add class conditionally using [ngClass]. Here's the example:

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>