ng-Modell-Nummer, wählen Sie Feld Option Werte sind Strings

Question

ich den folgenden Code

<select ng-disabled="currentQuestion.id" ng-change="loadTopics()" class="detail-subject-select browser-default" ng-model="currentQuestion.SubjectId"> 
     <option disabled="disabled" value="any">Choose a Subject</option> 
     <option value="1">K8-English</option> 
     <option value="2">K8-Math</option> 
    </select> 

Das Problem haben, ist dieser Wert 1 und 2 sind Strings. Ich brauche sie als Zahlen. Alles funktioniert gut, wenn ich einen auf meiner Seite auswähle, aber ich brauche das Auswahlfeld, um mit dem Wert von (currentQuestion.SubjectId, der eine Zahl ist) zu initialisieren, wenn die Seite geladen wird.

Wie kann ich das umgehen?

Answer 1

Eine Möglichkeit ist, Ihre Möglichkeiten als ein Array von Objekten zu definieren in Ihrem Controller wie folgt:

$ scope.options = [{ Wert: 1, Name: 'K8-English' }, { Wert: 2, Name: 'K8-Math' }];

und implementieren diese in Ihren HTML verwenden ng-Optionen wie folgt aus:

<select ng-disabled="currentQuestion.id" 
    ng-change="loadTopics()" 
    class="detail-subject-select browser-default" 
    ng-model="currentQuestion.SubjectId" 
    ng-options="option.value as option.name for option in options"> 
     <option disabled="disabled" value="any">Choose a Subject</option> 
</select> 

Answer 2

Standard-HTML-Attribute (wie "Wert") bedeuten immer Zeichenfolgen. Leider kann man nur erreichen, das mit ng-Optionen:

Unterstützung für ausgewählte Modelle mit Nicht-String-Wert ist über ngOptions zur Verfügung. https://docs.angularjs.org/api/ng/directive/ngValue

Es kann ein bisschen schmutzig erscheinen, aber mit mehr Optionen Sie tatsächlich etwas Tipp sparen:

<select 
 
     ng-disabled="currentQuestion.id" 
 
     ng-change="loadTopics()" 
 
     class="detail-subject-select browser-default" 
 
     ng-model="currentQuestion.SubjectId" 
 
     ng-options="value as key for (key, value) in { 
 
        'K8-English': 1, 
 
        'K8-Math': 2 
 
        }" 
 
     > 
 
    <option 
 
      disabled="disabled" 
 
      value="" 
 
      >Choose a Subject</option> 
 
</select>