IE不更新下拉选择显示

我有3个下拉与角度范围数组绑定到它。当我更新模型时，一个下拉菜单显示所选的值，但另外两个不更新显示。其实该项目被选中，但下拉列表显示一个空白项目。我使用的是AngularJS v1.2.2和IE11 在chrome中它工作正常。当使用带有过滤器IE不更新下拉选择显示

 
    //$scope.Areas is bound to dropdown and $scope.A.Area is the ng-model to Area dropdown, working fine 
    $scope.A.Area = $scope.Areas.firstOrDefault(function (x) { 
    return x.AreaID === $scope.RespondentAreaID; 
    }); 

    //$scope.Regions is bound to Region dropdown and $scope.A.Region is the ng-model to Region dropdown, not updating the dropdown diaplay in IE 
    $scope.A.Region = $scope.Regions.firstOrDefault(function (x) { 
    return x.RegionID === $scope.A.RespondentRegionID; 
    }); 

    // There is no countries list in the scope like $scope.Areas or $scope.Regions 
    // Countries are stored as navigational property with Region, so to populate the 
    // countries use the selected Region.Countries, not working in IE 
    if ((($scope.A.Region || {}).Countries || []).length) { 
    $scope.A.Country = $scope.A.Region.Countries.firstOrDefault(function (x) { 
    return x.CountryID === $scope.RespondentCountryID; 
    });

来源

2014-03-30 Biju Thomas

与任何一组选择下拉菜单具有完全相同的问题。如果您尝试再次选择下拉菜单中的值，似乎仍然有效。例如：在一组3个日期下拉列表中选择月份，尝试选择一天，但它只显示选择下拉菜单中的第一个选项。尝试再次选择一个值，它可以工作。带IE11的角1.2.0-rc.2。就拿它来说，在过去几天你还没有找到解决方案？ – areynolds

感谢areynolds，我找到了一个解决方案，如果我们更改下拉文本，它将选择该值。一旦下拉值设置在stackoverflow中找到这个解决方案，但不记得链接//这是一个IE修复程序，不更新下拉列表中具有ng选项的部分 \t \t \t angular.forEach（$（“select “），函数（currSelect）{ \t \t \t \t currSelect.options [currSelect.selectedIndex]的.text + =”“; \t \t \t}）; –

添加几行下面的地方（标记为粗体）的选择NG选项在渲染angular.js的selectDirective的功能对我来说工作得很好的选择问题只发生。我正在查看是否有其他可能的解决方案，而不是修补angularJS或forEach以下给出的？

  if (existingOption.label !== option.label) { 
       lastElement.text(existingOption.label = option.label); 
       **lastElement.attr('label', existingOption.label);** 
      }

和

   (element = optionTemplate.clone()) 
        .val(option.id) 
        .attr('selected', option.selected) 
        .text(option.label); 
       **element.attr('label', option.label);**

的问题是，如果标签在IE空白HTMLOptionElement的标签属性是不一样的文本属性。

这可以通过在屏幕加载后添加以下代码并查看FF和IE的Web控制台来查看差异来验证。如果你取消注释标签设置为文本的最后一行，它可以正常工作。或者如上所述修补angular.js。

// This is an IE fix for not updating the section of dropdowns which has ng-options with filters 
angular.forEach($("select"), function (currSelect) { 
    console.log("1.text ", currSelect.options[currSelect.selectedIndex].text); 
    console.log("1.label ", currSelect.options[currSelect.selectedIndex].label); 
    //console.log("1.innerHTML ", currSelect.options[currSelect.selectedIndex].innerHTML); 
    //console.log("1.textContent ", currSelect.options[currSelect.selectedIndex].textContent); 
    //console.log("1.cN.data ", currSelect.options[currSelect.selectedIndex].childNodes[0].data); 
    //console.log("1.cN.nodeValue ", currSelect.options[currSelect.selectedIndex].childNodes[0].nodeValue); 
    //console.log("1.cN.textContent ", currSelect.options[currSelect.selectedIndex].childNodes[0].textContent); 
    //console.log("1.cN.wholeText ", currSelect.options[currSelect.selectedIndex].childNodes[0].wholeText); 
    //console.log("1. ", currSelect.options[currSelect.selectedIndex], "\n"); 

    //currSelect.options[currSelect.selectedIndex].label = "xyz"; 
    //currSelect.options[currSelect.selectedIndex].label = currSelect.options[currSelect.selectedIndex].text; 
});

来源

2014-08-14 14:22:56

IE不更新下拉选择显示

回答

相关问题