AngularJS <select>问题

Question

我有一个奇怪的问题。我在我的应用中使用AngularJS，并且遇到了标签问题。我有一个控制器有我的元素处理的城市和州：

function MeuController($scope, $http) { 

$scope.states = []; 
$scope.selectedState = ''; 

$scope.cities = []; 
$scope.selectedCity = ''; 

$http.get('/state/GetStates').success(function(result) { 
    $scope.states = result; 
}); 

$scope.getCities = function() { 
    $http.get('/cities/GetCitiesByState?state=' + $scope.selectedState).success(function(result) { 
     $scope.cities = result; 
    }); 
} 
}); 

在这一点上，一切都好，容易理解。但是......

当我创建我的内容是这样的：

<select class="span2" name="SelectedState" ng-model="selectedState" 
ng-change="getCities()" ng-options="state.ID as state.Name for state in states"> 
    <option></option> 
</select> 

<select class="span6" name="SelectedCity" ng-model="selectedCity" 
ng-options="city.ID as city.Name for city in cities"> 
    <option></option> 
</select> 

...我的要素没有填写。

如果我试着这样说：

<select class="span2" name="SelectedState" ng-model="selectedState" 
ng-change="getCities()"> 
    <option ng-repeat="state in states" value="state.ID">{{state.Name}}</option> 
</select> 

<select class="span6" name="SelectedCity" ng-model="selectedCity"> 
    <option ng-repeat="city in cities" value="city.ID">{{city.Name}}</option> 
</select> 

现在值填入的元素。虽然，如果我更改“selectedState”范围变量的值，我的元素不会“选择”正确的值？

任何人都知道为什么？

非常感谢！

Answer 1

好的，所以实际上问题在ng-model和ng-options之间。

当你这样做：

<select class="span6" name="SelectedCity" ng-model="selectedCity" 
ng-options="city.ID as city.Name for city in cities"></select> 

然后$scope.selectedCity被分配到city.ID并不仅仅是city（检查这个fiddle）。

你应该写这样的：

<select class="span6" name="SelectedCity" ng-model="selectedCity" 
ng-options="city.Name for city in cities"></select> 

检查结果在这fiddle。

它解决了你的问题吗？