<div class="table">
      <columns *ngFor="let lampValue of getLampScenarioArray(); let i = index"
                     index="{{i}}" value="{{lampValue}}"></columns>
    </div>

<div class="rows" *ngFor="let val of getValueAsArray(); let i = index" class="level" (click)="changeValue(15 - i)"
     [ngClass]="{'on': val==1}">

{{15 - i}}
</div>

.level.on {
  background-color: #79acff;
}

.level:hover {
  background-color: #83b8ff;
}
.level.on:hover {
  background-color: #ffff00 ;
}

import {Directive, ElementRef, HostListener} from '@angular/core';

@Directive({
  selector: '[myHighlight]'
})
export class TableDirective {

  constructor(el: ElementRef) {
    el.nativeElement.divIcon().onMouseEnter();
  }

  @HostListener("mouseenter") onMouseEnter() {

  }

}