Question

我尝试使用下拉菜单，但我无法选择默认选择的第一个值。它显示空白。 master_data.sch_files有4个项目，但在下拉列表中显示5个，其中第1个时间为空。

<select ng-init="item.file_range_unit = master_data.sch_files[0].ref_key" ng-model="item.file_range_unit"
                        ng-options="x.ref_key as x.ref_value for x in master_data.sch_files" required style="height: 33px;
                       width: 140px; padding-left:5px">
                  </select>

Answer 1

您可以使用此$scope.form = {type : $scope.typeOptions[0].value};选择选项数据的第一个元素。

这也适用于here

function MyCtrl($scope) {

    // your option data
    $scope.typeOptions = [
       { name: 'Feature', value: 'feature' }, 
       { name: 'Bug', value: 'bug' }, 
       { name: 'Enhancement', value: 'enhancement' }
    ];

    $scope.form = {type : $scope.typeOptions[0].value};
}

Answer 2

参考：Why does AngularJS include an empty option in select?

当传递给ng-options的一组选项中不存在ng-model引用的值时，将生成空选项。这可以防止意外的模型选择：AngularJS可以看到初始模型在选项集中未定义或不定义，并且不希望自己决定模型值。

简而言之：空选项意味着没有选择有效模型（有效我的意思是：来自选项集）。您需要选择一个有效的模型值来摆脱这个空选项。

您需要做的就是给出一个默认值：

item.file_range_unit

如何在Angular JS下拉列表中选择第一项作为默认值？

2 个答案: