0

Requiero hacer un select con enumerados, en el cual se muestre un texto y el valor que almacene sea otro texto. Intenté de la siguiente manera pero obtengo el error:

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'typeof UserRole'. No index signature with a parameter of type 'string' was found on type 'typeof UserRole'.ngtsc(7053)

TypeScript

export enum UserRole {
  STUDENT = 'Estudiante',
  CAREER_DIRECTOR = 'Director de carrera',
  AUTHORITY = 'Autoridad',
  FINANCIAL = 'Dirección Financiera'
}
keys = Object.keys;
userRoles = UserRole;

Html (utilizo Angular-Material)

<mat-select  required formControlName="role">
      <mat-option *ngFor="let role of keys(userRoles)" [value]="role">
        {{userRoles[role]}}
      </mat-option>
    </mat-select>

1 respuesta 1

0

Lo que sucede, es que no puede inferir el tipo del objeto del iterador, el cual por defecto es de tipo string.

Teniendo en cuenta el código que pusiste (un poco modificado para levantarse de forma aislada):

export enum UserRole {
  STUDENT = 'Estudiante',
  CAREER_DIRECTOR = 'Director de carrera',
  AUTHORITY = 'Autoridad',
  FINANCIAL = 'Dirección Financiera'
}
const keys = Object.keys;
const userRoles = UserRole;

Al momento de ejecutar la función usando la directiva de Angular, lo que estarías ejecutando sería algo como esto:

for (const role of keys(userRoles)) {
  console.log(userRoles[role]);
}

Sin embargo, ya que al momento de ejecutar la validación de tipos, role es de tipo string, no del tipo clave del enumerador UserRole. Esto se puede solucionar ejecutando un assertion:

for (const role of keys(userRoles)) {
  const roleAsKey = role as keyof typeof userRoles;
  console.log(userRoles[roleAsKey]);
}

Pero claro, Angular no soporta esto en la template, por lo que tendrías que hacer uso de un método helper que permita deducir el tipo del valor, por ejemplo:

export function getKeys<T>(enumerator: T) {
  return Object.keys(enumerator).map(key => key as keyof T);
}

for (const role of getKeys(UserRole)) { // También puedes poner userRoles como parámetro
  console.log(userRoles[role]);
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.