javascript - AngularJS: ng-selected no muestra el valor seleccionado

Question

Esta pregunta ya tiene una respuesta aquí:

• AngularJS. Cuando se selecciona el atributo ng-model, ng-selected no funciona 2 respuestas

Como en el título, mi selección no parece capaz de mostrar el valor seleccionado, es decir, correctamente seleccionado ...

<md-input-container flex>
    <label>Anno selezione</label>
    <md-select name="annoSelect" ng-model="vm.anno_attuale"
               ng-value="vm.progetto.pprs[$index].anno"
               ng-selected="item.selected" >
         <md-option ng-repeat="item in vm.progetto.pprs" >
           {{vm.progetto.pprs[$index].anno}}
         </md-option>
    </md-select> 
</md-input-container>

Probé con algunas soluciones encontradas en la pila, como esa: Angular: ng-select no muestra el valor seleccionado de ng

pero ninguno de ellos solucionó el problema ... ¿Alguna idea?

Answer 1

De los docs:

Nota: ngSelected no interactúa con las directivas select y ngModel , solo establece el atributo selected en el elemento. Si está usando ngModel en la selección, no debe usar ngSelected en las opciones, ya que ngModel establecerá el valor de selección y las opciones seleccionadas.

- Referencia de la API de la directiva AngularJS ng-selected

La directiva ng-value está en el lugar equivocado:

<md-input-container flex>
    <label>Anno selezione</label>
    <md-select name="annoSelect" ng-model="vm.anno_attuale"
               ̶n̶g̶-̶v̶a̶l̶u̶e̶=̶"̶v̶m̶.̶p̶r̶o̶g̶e̶t̶t̶o̶.̶p̶p̶r̶s̶[̶$̶i̶n̶d̶e̶x̶]̶.̶a̶n̶n̶o̶"̶                 
               ̶n̶g̶-̶s̶e̶l̶e̶c̶t̶e̶d̶=̶"̶i̶t̶e̶m̶.̶s̶e̶l̶e̶c̶t̶e̶d̶"̶ ̶  >
         <md-option ng-repeat="item in vm.progetto.pprs" 
                    ng-value="item.anno">
           ̶{̶{̶v̶m̶.̶p̶r̶o̶g̶e̶t̶t̶o̶.̶p̶p̶r̶s̶[̶$̶i̶n̶d̶e̶x̶]̶.̶a̶n̶n̶o̶}̶}̶
           {{item.anno}}
         </md-option>
    </md-select> 
</md-input-container>

Para obtener más información, consulte Uso de ngValue para enlazar el modelo a una matriz de objetos.

Answer 2

Debe mover The ng-selected desde el elemento <select> elemento <option>

La directiva ng-selected establece el atributo seleccionado de un elemento <option> en una lista <select> .

ng-selected - AngularJS Doc

En su caso particular, parece que tiene más de un problema en su código. ng-value directivas ng-value y ng-selected pertenecen al elemento <md-options> . También debe elegir una estrategia, si usa ng-model y ng-value entonces no debería usar ng-selected .

Su código debe verse algo como esto:

<md-input-container flex>
<label>Anno selezione</label>
<md-select name="annoSelect" ng-model="vm.anno_attuale">
<md-option ng-repeat="item in vm.progetto.pprs" ng-value="vm.progetto.pprs[$index].anno">{{vm.progetto.pprs[$index].anno}}</md-option>
</md-select>
</md-input-container>

También me gustaría revisar su ng-model ng-value para asegurarme de que está obteniendo los valores que cree que es. Eche un vistazo aquí al material oficial de AngularJS mdSelect Docs . Hay un ejemplo muy similar al tuyo. ¡Debería ayudarte a ponerte en camino!