Como usar if ternario no angular?
if ternario angular
Desda versão 1.1.5 do angular pode ser usado o if ternário no framework semelhante ao usado em qualquer outra linguagem.
Sintaxe:
condicao ? "resultado caso verdadeiro" : "resultado caso falso"
Exemplo de condição:
condicao = (variavel === "valor verdadeiro")
Explicando a expresão do if ternário no angular
Se a condição é verdadeira, o operador retornará o valor de "resultado caso verdadeiro"; se não, ele retorna o valor de "resultado caso falso".
Histórico do if ternário no angular
Desdo angular 1.1.5 é possível usar o if ternário.
No AngularJS não era possível utilizar operadores ternários dentro de expressões. Isso só era possível com operadores lógicos para efetura a mesma lógica e obter o resultado esperado. Antes era preciso emulá-lo assim:
(condição && (resposta se verdadeiro) || (responda se for falso))
OU
{true: 'result_if_true', false: 'result_if_false'}[condição]
A segunda opção acima cria um objeto com duas propriedades. A sintaxe da matriz é usada para selecionar a propriedade com o resultado true ou a propriedade com o resultado false e retornar o valor referente.
Quando usar o if ternário no Angular?
O if ternário no angular se torna uma alternativa ao else do ngIf. O seria feito assim:
<span *ngIf="variavel === 'valor verdadeiro'"> conteúdo caso verdadeiro </span>
<span *ngIf="variavel !== 'valor verdadeiro'"> conteúdo caso falso </span>
OU
<span *ngIf="variavel === 'valor verdadeiro'; elseSpan"> conteúdo caso verdadeiro </span>
<ng-template #elseSpan> conteúdo caso falso </ng-template>
Pode ser feito assim, usando os operadores condicionais ternários:
<span> {{variavel === 'valor verdadeiro' ? 'conteúdo caso verdadeiro' : 'conteúdo caso falso'}} </span>
No arquivo ts, você também poderá atribuir a variáveis:
var variavel = condicao ? "valor verdadeiro" : "valor faldo";
Também são possíveis múltiplas avaliaçãoes ternárias, veja o exemplo abaixo:
var primeiraChecagem = false,
segundaChecagem = false,
variavel = primeiraChecagem ? "Resultado verdadeiro" : segundaChecagem ? "Resultado verdadeiro" : "Resultado Falso";
O que é condicional?
If, else e operador ternário são elementos condicionais usados nas mais diversas linguagens de programação, inclusive, no Type Script linguagem similar ao Java Script usada no Angular. Eles servem para manipular as decisões tomadas pelos scripts ao se depararem com determinados valores ou condições específicas.
Parabéns por ter chegado até aqui, qualquer coisa deixe um comentário.
VEJA MAIS:
Como fazer IF em uma linha?
Como funciona este if/else com "?" e ":"?
Como funciona o ngIf do Angular?
Como funciona o operador condicional ternário?
Como usar if ternário no Python?
Como usar if ternário no PHP?
Como usar o else no ngIf?
Como usar o ngIf do Angular?
Como usar o ng-show em condicionais no angular?
Como usar o ng-switch em condicionais no angular?
If, else e operador ternário: quais os exemplos de aplicação?
O que é else-if?
O que é if?
O que é if-else?
O que é if ternário?
O que é operador elvis?
O que é operador ternário?
O que é operador condicional ternário?
O que é operador ternário?
Quando usar o IF ternário?
Quando usar o ngIf e quando usar o [hidden]?
Leia mais em: ngular.io/
