4

Tengo unos datos como estos, los cuales tienen dos claves. En este caso janeth y v3swhmue05:

"janeth,v3swhmue05": [
   {
     id: 1,
     nombre: "janeth",
     hash: "v3swhmue05"
   }, 
   { 
     id:2,
     nombre: "janeth",
     hash: "v3swhmue05"
   }
]

En el HTML tengo algo como esto:

<div *ngFor="let item of confPersoDocenteClas | keyvalue">  
   <div>
         <h5 class="card-title">{{item.key}}</h5>
   </div>
</div>

Lo cual en el componente me muestra esto:

janeth,v3swhmue05

¿Cómo podría hacer para que solo me muestre la primera clave? que, en este caso, es janeth.

1
  • 1
    En realidad es una única clave lo que tienes, la cadena janeth,v3swhmue05, y no dos como estás indicando en el título. Que esta cadena contenga dos cosas separadas por una coma es algo con lo que tendrás que trabajar como con cualquier cadena de caracteres. ¿No será que quieres que se muestren los dos elementos que contiene dicha clave?
    – franmost
    el 25 oct. 2021 a las 14:11

2 respuestas 2

3

Puedes usar un split y seleccionar el elemento de la posición 0:

<div *ngFor="let item of confPersoDocenteClas | keyvalue">  
       <div>
             <h5 class="card-title">{{item.key.split(',')[0]}}</h5>
       </div>
    </div>
1
  • 1
    Gracias! Me sirvió mucho
    – pusux
    el 26 oct. 2021 a las 5:48
3

Tus datos solo contienen una clave llamada janeth,v3swhmue05, bajo la cual existen dos registros.

Si lo que quieres es iterar los dos registros de dicha clave, entonces deberás anidar el bucle de la siguiente manera:

<div *ngFor="let item of confPersoDocenteClas | keyvalue">
  <h5 class="card-title">Índice: {{item.key}}</h5>
  <div *ngFor="let contenido of item.value">
    <h5 class="card-title">{{contenido.nombre}} ({{ contenido.id }})</h5>
  </div>
</div>

Puedes ver un ejemplo en línea en la siguiente URL:

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.