angularjs - examples - option ng value

ng-options con array simple init

Question

Estoy un poco confundido con Angular y ng-options .

Tengo una matriz simple y quiero iniciar una selección con ella. Pero, quiero esa opción value = label.

script.js

$scope.options = [''var1'', ''var2'', ''var3''];

html

<select ng-model="myselect" ng-options="o for o in options"></select>

Lo que consigo:

<option value="0">var1</option>
<option value="1">var2</option>
<option value="2">var3</option>

Lo que quiero:

<option value="var1">var1</option>
<option value="var2">var2</option>
<option value="var3">var3</option>

Así que lo intenté:

<select ng-model="myselect2" ng-init=0 ng-options="options[k] as v for (k,v) in options"></select>

<select ng-model="myselect3" ng-init=0 ng-options="b as b for b in options"></select>

(Pero no funcionó)

Editar:

Mi formulario se envía de forma externa, por lo que necesito ''var1'' como el valor en lugar de 0.

Answer 1

En realidad lo has corregido en tu tercer intento.

 <select ng-model="myselect" ng-options="o as o for o in options"></select>

Vea un ejemplo de trabajo aquí: http://plnkr.co/edit/xEERH2zDQ5mPXt9qCl6k?p=preview

El truco es que AngularJS escribe las claves como números de 0 a n de todos modos, y traduce al actualizar el modelo.

Como resultado, el HTML se verá incorrecto, pero el modelo se establecerá correctamente al elegir un valor. (es decir, AngularJS traducirá ''0'' de nuevo a ''var1'')

La solución de Epokk también funciona, sin embargo, si carga datos de manera asincrónica, es posible que no siempre se actualice correctamente. El uso de ngOptions se actualizará correctamente cuando cambie el alcance.

Answer 2

Puede usar ng-repeat con una option como esta:

<form>
    <select ng-model="yourSelect" 
        ng-options="option as option for option in [''var1'', ''var2'', ''var3'']"
        ng-init="yourSelect=''var1''"></select>
    <input type="hidden" name="yourSelect" value="{{yourSelect}}" />
</form>

Cuando envía su form , puede obtener el valor de la entrada oculta.

DEMO

selección ng-repetición ng

Answer 3

Si configura su selección, haga lo siguiente:

<select ng-model="myselect" ng-options="b for b in options track by b"></select>

conseguirás:

<option value="var1">var1</option>
<option value="var2">var2</option>
<option value="var3">var3</option>

violín de trabajo: http://jsfiddle.net/x8kCZ/15/

Answer 4

podrías usar algo como

<select ng-model="myselect">
    <option ng-repeat="o in options" ng-selected="{{o==myselect}}" value="{{o}}">
        {{o}}
    </option>
</select>

usando ng-selected preselecciona la opción en caso de que myselect haya sido precargado.

Prefiero este método sobre ng-options de todos modos, ya que ng-options solo funciona con arrays. ng-repeat también funciona con objetos similares a json.

Answer 5

<select ng-model="option" ng-options="o for o in options">

$ scope.option será igual a ''var1'' después del cambio, incluso si ves value = "0" en html generado

plunker