角度選擇不工作

Question

控制器

$scope.formData = {}; 
$scope.formData.cars = {}; 
$scope.formData.cars.list = [ 
    { id: 1, name: 'vw 2'}, 
    { id: 2, name: 'vw 1'} 
]; 
$scope.formData.cars.selected = $scope.formData.cars.list[0]; 

HTML

<select id="bookingCars" class="form-control" ng-model="formData.cars.selected" ng-options="car.code as car.name for car in formData.cars.list"> 

任何人都可以解釋爲什麼這增加了第三個空白元素，爲什麼第一個屬性（vw 2）不是默認值？

Answer 1

試試這個：

ng-options="car as car.name for car in formData.cars.list" 

它應該工作：plunk。

您正在使用ngOption，其格式爲select as label for value in array。 Documentation說：

選擇：該表達式的結果將被綁定到的 父元素模型。如果未指定，則選擇表達式將 默認爲值。

因此，這意味着您希望select部分是一個對象，但是你提供的字符串car.code。

Answer 2

您不應該使用Object來設置選定的值，因爲您使用的是汽車的值「id」。

所以做這樣的事情：

$scope.formData = {}; 
$scope.formData.cars = {}; 
$scope.formData.cars.list = [ 
         { id: 1, name: 'vw 2'}, 
         { id: 2, name: 'vw 1'} 
        ]; 
$scope.formData.cars.selected = $scope.formData.cars.list[1].id; 

<select id="bookingCars" class="form-control" ng-model="formData.cars.selected" ng-options="car.id as car.name for car in formData.cars.list"> 

http://jsfiddle.net/KLDEZ/2/

Answer 3

如果您想使用整個對象的值下面的工作：

{{formData.cars.selected}} -  {{formData.cars.selected.id}} 
<select id="bookingCars" class="form-control" ng-model="formData.cars.selected" 
ng-options="c.name for c in formData.cars.list"> 

http://plnkr.co/edit/QZtEKWeXeHC9kcuEeGNi?p=preview