Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

ngClass x interpolação na classe

Verifiquei que, criando um método na classe do componente que estabeleça uma condição e interpolando diretamento no HTML (tipo, class="{{ metodoDinamico() }}") e usando o ngClass dá exatamente no mesmo resultado. O ngClass traz alguma vantagem (desempenho, boas práticas, etc) em relação a esta estratégia que coloquei ai, diretamente no class do HTML usando interpolação?

1 resposta
solução!

Olá, Alan!

Realemente Alan, a interpolação direta e o uso do ngClass basicamente dão na "mesma". Mas o ngClass possui algumas vantagens que podem ser úteis em certas situações.

O ngClass no Angular oferece vantagens claras sobre a interpolação direta de classes. Ele torna o código mais legível, permitindo condições complexas de forma clara e fácil. Além disso, é otimizado para melhor desempenho em comparação com a interpolação direta, especialmente em situações com muitas classes ou condições. Usar ngClass é uma boa prática no Angular, pois oferece controle granular sobre as classes CSS, contribuindo para a organização e manutenibilidade do código. Em suma, escolher ngClass não só melhora a legibilidade e o desempenho, mas também segue as melhores práticas de desenvolvimento Angular.

Um exemplo básico é:

<div class="{{ condicao1 ? 'classe1' : '' }} {{ condicao2 ? 'classe2' : '' }}">

Isso pode rapidamente se tornar confuso e difícil de ler (para algumas pessoas, é claro), principalmente com condições mais complexas. Com o ngClass, você pode escrever da mesma forma de maneira mais clara:

<div [ngClass]="{ 'classe1': condicao1, 'classe2': condicao2 }">

Espero ter ajuadado e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!