如何为指定Angular下拉菜单组件设置默认值

嘿，我来帮你搞定这个AngularJS下拉菜单的默认值问题！看你的代码用的是AngularJS（1.x版本）的指令，下面给你几种实用的实现方式：

方法一：直接给绑定的ng-model赋值 #

你的下拉菜单用ng-model="request.projectSelectedBarcode"绑定了选中值，而且每个选项的value是prj.Barcode。那最简单的方式就是在控制器里，当projectList数据准备好之后，把你想设为默认值的项目Barcode赋值给request.projectSelectedBarcode就行。

比如在控制器里加这段逻辑：

// 假设projectList是从接口或者本地加载的项目数据
$scope.projectList = [
  { Barcode: "PRJ001", Name: "项目A" },
  { Barcode: "PRJ002", Name: "项目B" }
];

// 确保数据加载完成后设置默认值（如果是异步请求，要放在回调里）
if ($scope.projectList.length > 0) {
  // 这里选第一个项目作为默认值，你也可以换成指定的Barcode
  $scope.request.projectSelectedBarcode = $scope.projectList[0].Barcode;
}

只要这个赋值的Barcode和某个选项的value完全匹配（包括数据类型！比如数字别写成字符串），对应的选项就会自动被选中。

方法二：改用ng-options（更推荐） #

如果你的下拉菜单是用ng-repeat生成的选项，其实换成ng-options会更简洁，而且默认值的设置逻辑更清晰。修改后的HTML代码如下：

<div hidden id="projectSelected">
  <label style="font-size: medium">Project *</label>
  <select name="projectSelected" id="projectSelectedId" class="form-control" 
          ng-model="request.selectedProject" 
          ng-options="prj.Barcode as prj.Name for prj in projectList"
          required>
  </select>
  <div style="color:maroon" ng-messages="getServiceReuqestForm.projectSelected.$error" ng-if="...">
    <!-- 错误提示内容 -->
  </div>
</div>

然后在控制器里设置默认值：

if ($scope.projectList.length > 0) {
  $scope.request.selectedProject = $scope.projectList[0].Barcode;
}

如果后续你需要用到整个项目对象而不只是Barcode，还可以把ng-options改成prj as prj.Name for prj in projectList，对应的ng-model绑定request.selectedProject，默认值设为$scope.projectList[0]，这样直接就能拿到完整的项目数据，非常方便。

注意事项 #

• 异步数据要在回调里设置：如果projectList是通过AJAX请求获取的，一定要把设置默认值的代码放在请求成功的回调函数里，不然数据还没加载完成，数组是空的，赋值会无效。
• 数据类型要匹配：比如prj.Barcode是数字类型，那你赋值的默认值也得是数字，不能是字符串，否则AngularJS会认为不匹配，下拉菜单不会选中对应的选项。

内容的提问来源于stack exchange，提问作者trx