Angular Select spiegelt nicht sein Modell

Question

seltsames Verhalten für mich. Ich bin ziemlich neu in Angular und wahrscheinlich mache ich etwas falsch.

Das ist mein Szenario:

HTML:

<div ng-controller="ExampleController"> 
    <label>Color: 
    <select ng-model="myColor" ng-options="color.name for color in colors"> 
    <option value="">-- choose color --</option> 
    </select> 
    </label> 
<div> 
<button ng-click="myColor = { name:'not in list', shade: 'other' }">clear</button> 
</div> 
</div> 

JS:

angular.module('selectExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
    $scope.colors = [ 
     {name:'black', shade:'dark'}, 
     {name:'white', shade:'light'}, 
     {name:'red', shade:'dark'}, 
     {name:'blue', shade:'dark'}, 
     {name:'yellow', shade:'light'} 
    ]; 
    $scope.myColor = $scope.colors[2]; 
    }]); 

und hier ist die Geige:

https://jsfiddle.net/t18uggqt/

Kann jemand mir hilft, bitte zu verstehen, warum die Auswahl spiegelt nicht das Modell (es gibt nur erste Wahl verfügbar)

Dank!

Answer 1

In Ihrem jsfiddle, haben Sie nicht ng-app="selectExample" enthalten

und AngularJS innen Körper/Kopf aufrufen, wenn Sie jsFiddle verwenden.

finden Sie die aktualisierte Geige: https://jsfiddle.net/varit05/t18uggqt/4/

Ich hoffe, dass es Ihnen hilft.

Prost :)