Question

我有3个下拉角，其中有角度范围数组。当我更新模型时，一个下拉列表显示所选的值，但其他两个没有更新显示。实际上该项目已被选中，但下拉列表显示一个空白项目。我正在使用AngularJS v1.2.2和IE11 在铬合金它工作正常。选择问题仅在使用带过滤器的选择ng-options时发生

   
    //$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;
    });

Answer 1

在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的label属性与text属性不同。

通过在加载屏幕后添加以下代码并查看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;
});

IE不更新下拉选择显示

1 个答案: