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

446
Vistas
Uso de Enums en la plantilla HTML de Angular 8 para * ngIf

¿Cómo puedo usar Enums en la plantilla Angular 8?

componente.ts

 import { Component } from '@angular/core'; import { SomeEnum } from './global'; @Component({ selector: 'my-app', templateUrl: './app.component.html', styleUrls: [ './app.component.css' ] }) export class AppComponent { name = SomeEnum.someValue; }

componente.html

 <span *ngIf="name === SomeEnum.someValue">This has some value</value>

Esto actualmente no funciona, ya que la plantilla no hace referencia a SomeEnum . ¿Cómo puedo resolverlo?

ERROR Error: Cannot read property 'someValue' of undefined

over 4 years ago · Santiago Trujillo
4 Respuestas
Responde la pregunta

0

Tendrás que declararlo como una propiedad primero:

 import { Component } from '@angular/core'; import { SomeEnum } from './global'; @Component({ selector: 'my-app', templateUrl: './app.component.html', styleUrls: [ './app.component.css' ] }) export class AppComponent { name = SomeEnum.someValue; importedSomeEnum = SomeEnum; }

Y luego úsalo en la plantilla:

 <span *ngIf="name === importedSomeEnum.someValue">This has some value</span>

Aquí hay una demostración de trabajo para su ref.

over 4 years ago · Santiago Trujillo Denunciar

0

Puede declarar un campo igual a la enumeración SomeEnum (puede importarse desde otro archivo) como un campo de clase pública en el archivo del componente. Entonces será accesible en la plantilla.

 // component export class AppComponent { name = SomeEnum.someValue; enum = SomeEnum; } // template <span *ngIf="name === enum.someValue">This has some value</value>
over 4 years ago · Santiago Trujillo Denunciar

0

en el TS

 import { SomeEnum } from 'path-to-file'; public get SomeEnum() { return SomeEnum; }

en el uso de HTML

 *ngIf="SomeEnum.someValue === 'abc'"

EDITAR: pasa el tiempo y aprendemos más como desarrolladores, el enfoque que estoy usando en este momento no usa el método get . Ambas soluciones funcionan, solo elige la que más te guste.

en el TS

 import { SomeEnum } from 'path-to-file'; export class ClassName { readonly SomeEnum = SomeEnum; }

en el uso de HTML

 *ngIf="SomeEnum.someValue === 'abc'"
over 4 years ago · Santiago Trujillo Denunciar

0

Sí, la plantilla no puede hacer referencia a la enumeración directamente. Hay pocas maneras de hacer esto. 1. Agregue la referencia Enum al archivo ts del componente como se muestra a continuación

 someEnum = SomeEnum;

entonces podrá usar la referencia en su plantilla de esta manera

 <span *ngIf="name === someEnum.someValue">This has some value</value>
  1. La segunda forma es llamar a una función desde su plantilla con el nombre como parámetro y compararla en el archivo mecanografiado.

<span *ngIf="checkCondition(name)">This has some value</value>

over 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