AngularJS版本问题：为何1.4.x无法默认选中禁用选项，1.5.x可行？

这个问题本质是AngularJS在1.5版本中修复了<select>指令处理禁用选项默认选中的Bug，咱们来具体拆解原因和解决办法：

核心原因 #

AngularJS 1.4.x的<select>指令在初始化时，会主动忽略禁用选项的默认匹配逻辑——它内部的渲染逻辑会跳过所有disabled为true的选项，不会将模型值与这些禁用选项做绑定匹配。而1.5.x版本中，官方对齐了原生HTML的行为，修复了这个限制，允许禁用选项被默认选中，只要模型值和选项的ng-value/value属性匹配。

代码验证示例 #

先补全你提到的完整可运行代码：

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Select Disabled Option Test</title>
  <script src="//code.angularjs.org/1.5.5/angular.min.js"></script>
</head>
<body ng-app="selectExample">
  <div ng-controller="ExampleController">
    <select ng-model="selectedColor" ng-options="color.name for color in colors track by color.value">
    </select>
    <p>当前选中: {{selectedColor}}</p>
  </div>

  <script>
    angular.module('selectExample', [])
      .controller('ExampleController', ['$scope', function($scope) {
        $scope.colors = [
          {name: '黑色', value: 'black'},
          {name: '白色', value: 'white', disabled: true},
          {name: '红色', value: 'red'}
        ];
        // 尝试默认选中禁用的白色选项
        $scope.selectedColor = {name: '白色', value: 'white', disabled: true};
      }]);
  </script>
</body>
</html>

• 在1.4.x环境运行：下拉框会显示为空，selectedColor无法和禁用的白色选项绑定
• 在1.5.5环境运行：下拉框会默认选中白色选项，即使它是禁用状态

1.4.x版本的临时解决方案 #

如果你暂时无法升级版本，可以通过以下两种方式实现需求：

• 方案一：手动触发DOM选中
  利用$timeout确保DOM渲染完成后，通过原生JS选中目标选项：

  angular.module('selectExample', [])
    .controller('ExampleController', ['$scope', '$timeout', function($scope, $timeout) {
      $scope.colors = [
        {name: '黑色', value: 'black'},
        {name: '白色', value: 'white', disabled: true},
        {name: '红色', value: 'red'}
      ];
      $scope.selectedColor = {name: '白色', value: 'white', disabled: true};
      
      // 等待DOM渲染完成后执行
      $timeout(function() {
        document.querySelector('select option[value="white"]').selected = true;
      });
    }]);
  

• 方案二：升级到1.5+版本（推荐）
  直接升级AngularJS版本到1.5.x及以上，官方已经原生支持禁用选项的默认选中，无需额外代码。

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