Angularjs 使用angular修改选项时在IE中的selectbox上进行选择_Angularjs_Internet Explorer_Select

Angularjs 使用angular修改选项时在IE中的selectbox上进行选择

angularjs internet-explorer select

Angularjs 使用angular修改选项时在IE中的selectbox上进行选择,angularjs,internet-explorer,select,Angularjs,Internet Explorer,Select,我正在开发一个使用Angular的应用程序，我们希望同步两个selectbox（HTML）。这意味着，当我单击第一个选择框中的值时，我希望第二个选择框中的值更新，并且也可以单击我做了以下几步来解释我们的问题： "严格使用",； angular.module（“myApp”，[]）.run（函数（$rootScope）{}）.config（函数（）{}）；角度。模块（'myApp'）。控制器（'myCtrl'，函数( $scope）{ //$scope.obj2Selected=null；

我正在开发一个使用Angular的应用程序，我们希望同步两个selectbox（HTML）。这意味着，当我单击第一个选择框中的值时，我希望第二个选择框中的值更新，并且也可以单击

我做了以下几步来解释我们的问题：


"严格使用",；
angular.module（“myApp”，[]）.run（函数（$rootScope）{}）.config（函数（）{}）；
角度。模块（'myApp'）。控制器（'myCtrl'，函数(
$scope）{
//$scope.obj2Selected=null；
$scope.list1=[]；
$scope.list1.push({
id:“1”，
名称：“1”，
所选：false
});
$scope.list1.push({
id:“2”，
名称：“2”，
所选：false
});
$scope.list1.push({
id:“3”，
名称：“3”，
所选：false
});
$scope.list2=[]；
$scope.list2.推送({
id:“1”，
名称：“1”
});
$scope.list2.push({
id:“2”，
名称：“2”
});
$scope.list2.push({
id:“3”，
姓名：“3”
});   
$scope.selectionObjDone=函数（）{
$scope.obj2Selected=null；
$scope.list2.length=0；
$scope.list2.push({
id:Math.random（）.toString（），
名称：Math.random（）.toString（）
});
$scope.list2.push({
id:Math.random（）.toString（），
名称：Math.random（）.toString（）
});
};
});

在这辆车里，一切看起来都很好。但是，如果您在test.html中复制/粘贴完全相同的代码，例如，在IE（V11）中打开它，您将看到问题：首先单击第一个选择框以选择一个或另一个选项。然后尝试在第二个选择框中选择一个选项，您将看到无法再进行选择

它在FF或Chrome中工作得很好，在Plunker上也工作得更好，即使有时它在Plunker中停止工作（我没有找到确切的用例）

它与我清空用于填充第二个选择框的数组这一事实有着真正的联系。如果我评论这句话，一切正常： $scope.list2.length=0

我尝试了不同的方法来清空此数组：

有人知道这里发生了什么以及如何解决吗

谢谢

最后，即使有Angular的专家，我们也没有找到答案，但等了几分钟，Angular的新版本（1.5.7）神奇地解决了这个问题

<html ng-app="myApp">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js" type="text/javascript"></script>
<script>
'use strict';
angular.module("myApp", []).run(function($rootScope) {}).config(function () {});

angular.module('myApp').controller('myCtrl',  function(
        $scope) {
    //$scope.obj2Selected = null;
    $scope.list1 = [];
    $scope.list1.push({
                id : "1",
                name : "1", 
                selected : false
            });
    $scope.list1.push({
                id : "2",
                name : "2", 
                selected : false
            });
    $scope.list1.push({
                id : "3",
                name : "3", 
                selected : false
            });

    $scope.list2 = [];
    $scope.list2 .push({
                id : "1",
                name : "1" 
            });
    $scope.list2.push({
                id : "2",
                name : "2"
            });
    $scope.list2.push({
                id : "3",
                name : "3" 
            });   

    $scope.selectionObjDone = function(){
        $scope.obj2Selected = null; 
        $scope.list2.length = 0;
      $scope.list2.push({
            id : Math.random().toString(),
            name : Math.random().toString()
        });
      $scope.list2.push({
            id : Math.random().toString(),
            name : Math.random().toString()
        });
    };
});
</script>
<div ng-controller="myCtrl">

<select size="10" id="listNodes" style="width:200px;"
    ng-options="obj as obj.name for obj in list1 track by obj.id" ng-model="objSelected"
    ng-change="selectionObjDone()">
</select>
<select size="10" style="width:200px;" id="select2"
    ng-options="obj as obj.name for obj in list2 track by obj.id"
    ng-model="obj2Selected" >
</select>

</div>
</html>