Question

我有一些简单的角度代码，用于渲染表单并使用数组中的选项填充选择框：

HTML：

<form class="form-horizontal">
  <div class="control-group">
      Title: <br />
      <input ng-model="new_project.title" type="text" id="title" class="form-control" placeholder="Title" >
      Created By: <br />
      <select data-ng-options="o.name for o in assignedToOptions" data-ng-model="new_project.created_by" id="created_by" class="form-control"></select>
  </div>
  ...
</form>

JS：

$scope.getUsers = function () {
    ConcernService.list('users/').then(function(data) {
        $scope.users = data;
        // assign user list to select options
        $scope.assignedToOptions = [];
        i = 0;
        while (i < data.length) {
            $scope.assignedToOptions.push({ name: data[i].id, name: data[i].username });
            i++;
        };
    });
};

这一切都很好，但Angular总是在选择字段中放置一个空白选项。消除空白选项的最佳方法是什么？

Answer 1

要消除空白选项，您需要确保选择模型具有初始值。

您可以在控制器中进行设置：

$scope.new_project = 
    {
      created_by: $scope.assignedToOptions[0]
    };

或者通过向select元素添加以下属性：

ng-init="new_project.created_by = assignedToOptions[0]"

防止Angular中的初始选择选项为空

1 个答案: