Configuración de valores en ng-options para AngularJS

La directiva ng-options de AngularJS permite a los desarrolladores completar opciones para una etiqueta . Una pregunta común que surge es cómo configurar el atributo de valor para cada opción.

Para comprender el mecanismo de configuración de valores, profundicemos en la sintaxis de ngOptions. Se necesita una expresión en una de estas formas:

Para matrices:

label for value in array

Para objetos:

label for (key, value) in object

Considere la siguiente matriz de ejemplo:

array = [{ "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" }];

Para completar las opciones usando ng-options, podemos escribir:

En este caso, obj.value determinará el valor seleccionado para cada opción.

Actualización: seguimiento por expresión de valor

Con las actualizaciones recientes de AngularJS, ahora es posible especificar explícitamente el valor del atributo de valor utilizando un seguimiento por expresión:

Recordar la sintaxis

La sintaxis de ngOptions puede ser difícil de recordar. Una analogía útil es pensar en ello como una versión extendida de las listas por comprensión de Python:

[x**2 for x in [1, 2, 3, 4, 5]]

Sin embargo , en ng-options, distinguimos entre el valor y el texto mostrado para cada opción usando la palabra clave as:

person.id as person.name for person in people

Para objetos JavaScript, la sintaxis es similar, usando pares (clave, valor):

for (key, value) in object