Solucionado (ver solução)

Importante

Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!

Solucionado
(ver solução)
1
resposta

O hover não está funcionando com o uso da template string

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

@Directive({
    selector: '[apDarkenOnHover]'
})
export class DarkenOnHoverDirective {

    @Input() brightness = '70$';

    constructor(
        private el:ElementRef,
        private render: Renderer
    ) { }

    @HostListener('mouseover')
    darkenOn(){
        this.render.setElementStyle(this.el.nativeElement,'filter', `brightness(${this.brightness})`);
    }

    @HostListener('mouseleave')
    darkenOff() {
        this.render.setElementStyle(this.el.nativeElement,'filter', 'brightness(100%)');
    }
}
1 resposta
solução!

Bom dia. Ha um erro de digitação, veja:

 @Input() brightness = '70$';

A unidade de medida é percentual e não $.

Sucesso e bom estudo meu aluno.