ng-selected sollte im Verzeichnis <option> Tag verwendet wird, nicht in dem <select> -Tag. Nehmen Sie einen näheren Blick auf seine doc und dem Beispiel.
Weil die Bestimmung der select -Direktive der ausgewählten Option auf ngModel basiert. Sobald Sie also ng-selected="c.CollegeName == collegeSelection.CollegeName" entfernen, sollte Ihr Code funktionieren.
habe ich eine sehr einfache zupfen die "ausgewählt" -Funktion in demonstrieren select Richtlinie.
AngularJS verwendet ngModel Direktive "Zwei-Wege-Datenbindung" zwischen Ihrem Modell und UI-Elementen zu ermöglichen.
Im Fall von "select", das Modell collegeSelection Sie als <select ng-model="collegeSelection" ...> angegeben ist das ausgewählt Element. Was bedeutet, wenn ein Benutzer ein Element aus der Dropdown auf der Seite auswählt, collegeSelection wird in diesem Artikel festgelegt wird; und , wenn Sie collegeSelection auf ein Element in Ihrem JavaScript-Code setzen, stellt AngularJS sicher, dass das entsprechende <option> ausgewählt ist.
Sagen Sie, Sie haben den folgenden Code in Ihrem Controller:
%Vor%Und das HTML sieht so aus:
%Vor%Das ist es! Das erste College im Colleges-Array wird ausgewählt , wenn Sie den Code ausführen.
Merken Sie sich nur collegeSelection ist die ausgewählte Option, egal, weil der Benutzer ein Element auf der Benutzeroberfläche ausgewählt hat oder Sie ein Element in Javascript ausgewählt haben.
So funktioniert die bidirektionale Datenbindung.
Nachdem ich eine Weile mit ng-selected herumgespielt habe, konnte ich es nicht so funktionieren lassen, wie du es willst. Allerdings konnte ich eine bestimmte Option mit ng-init vorauswählen.
Hier ist ein JSFiddle meiner Lösung. Meine <select> endete als:
Und mein colors -Array ist:
Wenn Sie ng-init="selectedColor='yellow'" auf einen anderen Wert ändern, wird eine andere Option ausgewählt.
Manche Leute haben Probleme damit. Ich fand eine großartige Lösung für ein einfaches Drop-Down wenn controller as someController
'
Ich hatte ein ähnliches Problem und erkannte, dass die Ursache in den unterschiedlichen Datentypen lag. ng-model wurde mit einem Stringwert verglichen, aber ich zog eine ganze Zahl aus der Datenbank, sodass sie die Option nicht automatisch auswählte. Um dies zu überwinden, habe ich nach der Abfrage der Daten aus der Datenbank toString() für die Ganzzahl aufgerufen, um sicherzustellen, dass die Datentypen übereinstimmen.
Tags und Links javascript angularjs angularjs-directive