Select wird nicht aktualisiert, wenn ng-Modell geändert wird

Question

ich Code wie diese:

<select ng-model="mode" ng-init="mode=10"> 
    <optgroup label="Serif"> 
     <option value="0">Normal</option> 
     <option value="1">Bold</option> 
     <option value="2">Italic</option> 
     <option value="3">Bold Italic</option> 
    </optgroup> 
    <optgroup label="Sans"> 
     <option value="4">Normal</option> 
     <option value="5">Bold</option> 
     <option value="6">Italic</option> 
     <option value="7">Bold Italic</option> 
    </optgroup> 
    <optgroup label="Script"> 
     <option value="8">Normal</option> 
     <option value="9">Bold</option> 
    </optgroup> 
    <optgroup label="Fraktur"> 
     <option value="10">Normal</option> 
     <option value="11">Bold</option> 
    </optgroup> 
    <optgroup label="Monospace"> 
     <option value="12">Normal</option> 
    </optgroup> 
    <optgroup label="Double-struck"> 
     <option value="13">Bold</option> 
    </optgroup> 
    </select> 
    <label for="text">Input Text</label> 
    <input id="text" ng-model="input"/> 
    <div> 
    Output: {{input|convert:mode}} 
    </div> 

der Modus Bereichswert geändert wird, konvertiert Filter wird mit mode == 10 ausgeführt, aber die select ist es immer noch nicht aktualisieren nicht ausgewählt. Wie kann ich beheben, dass die Aktualisierung aktualisiert wird, wenn sich die Bereichsvariable ändert?

Hier ist code pen, die das Problem demonstrieren.

Answer 1

Da Optionswerte als string behandelt werden, müssen Sie ng-init Wert als string wie unten

<select ng-model="mode" ng-init="mode='10'"> 

DEMO

Answer 2

einstellen Jedes Mal, wenn Sie einen String-Wert in ng-init binden sollte es behandelt werden Zeichenkette, die mit einfachem Anführungsstrich, mode='10'

<select ng-model="mode" ng-init="mode='10'"> 

eingebettet wird DEMO