I have the following directive:
import {Directive, ElementRef, Input, Renderer} from '@angular/core';
@Directive({
selector: '[tipo-coluna]',
})
export class TipoColunaDirective {
@Input() corOperacao: number;
constructor(public renderer: Renderer,
public elementRef: ElementRef
) {
this.bordaCorColuna()
}
private bordaCorColuna() {
console.log(this.corOperacao);
if(this.corOperacao == 1){
this.renderer.setElementStyle(this.elementRef.nativeElement, 'border-left', '2px solid green');
}
if(this.corOperacao == 2){
this.renderer.setElementStyle(this.elementRef.nativeElement, 'border-left', '2px solid #BFB34D');
}
if(this.corOperacao == 3){
this.renderer.setElementStyle(this.elementRef.nativeElement, 'border-left', '1px solid #BF4D3C');
}
}
}
In my template I have the following repeat structure:
<tr *ngFor="let log of logs; let i = index">
<td tipo-coluna corOperacao='1' scope="row">{{log.operacao}}</td>
<td>{{log.created_at | date:'dd/MM/yyyy' }} {{log.created_at | date:'shortTime' }}</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
In my console.log (this.corperation) is returning undefined. Why?
In my module I declare this directive.