Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

280
Vistas
¿Cómo puedo usar "*ngIf else"?

Estoy usando Angular y quiero usar *ngIf else (disponible desde la versión 4) en este ejemplo:

 <div *ngIf="isValid"> content here ... </div> <div *ngIf="!isValid"> other content here... </div>

¿Cómo puedo lograr el mismo comportamiento con ngIf else ?

about 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Angular 4 y 5 :

Usando else :

 <div *ngIf="isValid;else other_content"> content here ... </div> <ng-template #other_content>other content here...</ng-template>

También puedes usar then else :

 <div *ngIf="isValid;then content else other_content">here is ignored</div> <ng-template #content>content here...</ng-template> <ng-template #other_content>other content here...</ng-template>

O then solo:

 <div *ngIf="isValid;then content"></div> <ng-template #content>content here...</ng-template>

Manifestación:

Plunker

Detalles:

<ng-template> : es la propia implementación de Angular de la etiqueta <template> que está de acuerdo con MDN :

El elemento HTML <template> es un mecanismo para almacenar contenido del lado del cliente que no se representa cuando se carga una página, pero que posteriormente se puede crear una instancia durante el tiempo de ejecución mediante JavaScript.

about 4 years ago · Santiago Trujillo Denunciar

0

En Angular 4.xx

Puede usar ngIf de cuatro maneras para lograr un simple procedimiento if - else :

  1. solo usa si

     <div *ngIf="isValid"> If isValid is true </div>
  2. Usando If con Else (por favor notifique a templateName )

     <div *ngIf="isValid; else templateName"> If isValid is true </div> <ng-template #templateName> If isValid is false </ng-template>
  3. Usando If with Then (por favor notifique a templateName )

     <div *ngIf="isValid; then templateName"> Here is never showing </div> <ng-template #templateName> If isValid is true </ng-template>
  4. Uso de If con Then y Else

     <div *ngIf="isValid; then thenTemplateName else elseTemplateName"> Here is never showing </div> <ng-template #thenTemplateName> If isValid is true </ng-template> <ng-template #elseTemplateName> If isValid is false </ng-template>

Sugerencia: ngIf evalúa la expresión y luego representa la plantilla " then " o " else " en su lugar cuando la expresión es verdadera o falsa, respectivamente.

Típicamente el:

  • entonces la plantilla es la plantilla en línea de ngIf a menos que esté vinculada a un valor diferente.
  • otra plantilla está en blanco a menos que esté enlazada.
about 4 years ago · Santiago Trujillo Denunciar

0

Para Angular 9/8

Enlace fuente con ejemplos

 export class AppComponent { isDone = true; }

1) *ngSi

 <div *ngIf="isDone"> It's Done! </div> <!-- Negation operator--> <div *ngIf="!isDone"> It's Not Done! </div>

2) *ngIf y Else

 <ng-container *ngIf="isDone; else elseNotDone"> It's Done! </ng-container> <ng-template #elseNotDone> It's Not Done! </ng-template>

3) *ngIf, Entonces y Else

 <ng-container *ngIf="isDone; then iAmDone; else iAmNotDone"> </ng-container> <ng-template #iAmDone> It's Done! </ng-template> <ng-template #iAmNotDone> It's Not Done! </ng-template>
about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda