AngularJS: ¿cómo puedo hacer referencia al nombre de la propiedad dentro de un ng-Repeat?


134

Además de representar el valor de las propiedades en un objeto, también me gustaría representar el nombre de la propiedad como una etiqueta. ¿Hay alguna manera de hacer esto ng-repeat? Por ejemplo:

<ul>
    <li ng-repeat="option in data">{{propertyName}}: {{option}}</li>
</ul>

Lo que podría escupir algo como esto:

<ul>
    <li>Name: John</li>
    <li>Phone: (123) 456-7890</li>
    <li>Country: England</li>
</ul>

Respuestas:


337

Prueba esto:

<ul>
    <li ng-repeat="(key,val) in data">{{key}}: {{val}}</li>
</ul>

30
@Andy: en realidad no son tan geniales. Necesitan ejemplos de código reales más simples como los que has mostrado aquí. Gracias por su respuesta y siga publicando en StackOverflow; su publicación realmente me ayudó a entender cómo acceder a los documentos de AngularJS. Saludos cordiales y upvote!
noogrub 01 de

tan fácil pero no lo pensé: D tnx!
Guntram

qué hacer si tengo una función como --- myFunc (clave) --- que necesita el valor de la clave, esto me mostrará la clave del nombre en html y no el valor
Nejmeddine Jammeli

28

El problema con la documentación es que dice (key, value)con ese espacio ... me tomó un tiempo descubrir que por eso no funciona


1
Muchas gracias. Tienes razón. No puede tener un espacio entre la coma y el valor. (clave, valor) no (clave, valor).
Chad DeShon

9
Tal vez las cosas son diferentes en las versiones más recientes de Angular, pero puede tener un espacio entre ellas (key, val). Así es como lo hago a menudo.
EnigmaRM

Descubrí que (clave, valor) no funcionaba para mí. ¿Estás diciendo que es por el espacio en blanco? Geez! Pero gracias.
code-sushi

2
Funciona para mí con el espacio también.
Shawn Lauzon

val vs valor que afecta el espacio?
Danny Mahoney
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.