选择中的AngularJS默认选项在IE9中不起作用答案

【问题标题】：AngularJS default option in select not working in IE9选择中的AngularJS默认选项在IE9中不起作用
【发布时间】：2015-10-20 03:33:14
【问题描述】：

我的 AngularJS 应用程序中有一个表单，其中包含带有默认选项的下拉菜单。我使用 ng-init 和 ng-selected 来实现这一点。它在 Chrome 中运行良好，但在 Internet Explorer 9 中，当我第一次加载页面时，下拉菜单中显示的是文字 angularjs 表达式，即“{{ showMethod(args) }}”。当我去更改选项时，选项就在那里。只是最初没有表达出来。

这是我的 HTML 代码：

<td>
    <div ng-if="var.methods.length==0">NA</div>
    <div ng-if="var.methods.length>0">
        <select ng-init="selectedmethods[var.id]=defaultMethod(var.id,var.methods)" ng-model="selectedmethods[var.id]" >
           <option ng-repeat="method in var.methods" value="{{method.id}}" ng-selected="isMethodSelected(var.id,method)">{{ showMethod(method,var.id)}}</option>
        </select>
    </div>

这是另一个 ng-repeat 的一部分。
最初，我使用 ng-init 将所选方法设置为该变量的默认方法。使用 ng-selected 和一个名为 isMethodSelected 的方法，我通过检查 selectedmethods 对象来检查用户是否选择了该方法，如果没有，则检查该方法是否为默认方法。然后，我使用 showMethod 函数显示方法名称，我添加了该函数以查看这是否有助于 IE 中的问题（它没有）。我之前的只是表达式method.formattedMethodName。

这是我的 JS 代码的一部分：

$scope.isMethodSelected = function(varid,method) {
       var sel = false;
       if($scope.request.specsByVar.hasOwnProperty(varid) && $scope.request.specsByVar[varid].method.id==method.id) {
           sel = true;
       } else if(!$scope.request.specsByVar.hasOwnProperty(varid) && method.defaultMethod) {
           sel = true;
       }
       return sel;
   }

   $scope.defaultMethod = function(varid,methods) {
       var defaultMethod;
       if($scope.request.specsByVar.hasOwnProperty(varid)) {
           defaultMethod = $scope.request.specsByVar[varid].method.id;
       } else {
           for (var i = 0; i < methods.length; i++) {
               if(methods[i].defaultMethod) {
                   defaultMethod = methods[i].id;
                   break;
               }
            }
       }
       return defaultMethod;
   }

   $scope.showMethod = function(method,varid) {
       if(method) {
           return method.formattedMethodName;
       } else {
           return $scope.selectedmethods[varid].formattedMethodName;
       }
    };

这显然是一个 IE 问题。有人有解决办法吗？

谢谢，奥尔加

【问题讨论】：

标签： javascript html angularjs internet-explorer selected

【解决方案1】：

我能够通过使用 ng-options 解决这个问题：

    <select ng-init="selectedmethods[var.id]=defaultMethod(var.id,var.methods)" 
         ng-model="selectedmethods[var.id]" title="{{ selectedmethods[var.id].formula }}" 
         ng-options="method.id as method.formattedMethodName for method in var.methods | filter:{active:true}">

    </select>

【讨论】：