2014-01-16 42 views
3

控制器角度选择不工作

$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)不是默认值?

回答

2

试试这个:

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

它应该工作:plunk

您正在使用ngOption,其格式为select as label for value in arrayDocumentation说:

选择:该表达式的结果将被绑定到的 父元素模型。如果未指定,则选择表达式将 默认为值。

因此,这意味着您希望select部分是一个对象,但是你提供的字符串car.code

1

您不应该使用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/

1

如果您想使用整个对象的值下面的工作:

{{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