0

我寫了一個角度控制器,它一致地崩潰Internet Explorer 11,但在Chrome,Firefox和Opera中按預期工作。角度控制器崩潰Internet Explorer 11

這裏沒有太複雜的內容,它使用複選框在顯示所有值或數組的子集之間切換顯示錶格行中的數組值。

單擊該框兩次觸發

<div ng-app="monthsApp"> 
    <div ng-controller="MonthsCtrl as monthsCtrl"> 
    <table style="border-collapse: collapse;"> 
     <colgroup> 
     <col span="{{monthsCtrl.getSpan()}}" /> 
     </colgroup> 
     <thead> 
     <tr> 
      <th> 
      <div> 
       switch between six and twelve months: 
       <input id="agings-open-balances-matrix-state" ng-model="monthsCtrl.sixOrTwelve" type="checkbox" ng-click="monthsCtrl.updateDisplay()"> 
      </div> 
      </th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr> 
      <td>Months</td> 
      <td ng-repeat="month in monthsCtrl.monthsToDisplay">{{month}}</td> 
     </tr> 
     </tbody> 
    </table> 
    </div> 
</div> 
<script> 
    var monthsApp = angular.module('monthsApp', []); 
    monthsApp.controller('MonthsCtrl', function() { 
    var vm = this; 
    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; 
    vm.sixOrTwelve = false; //false = display six month; true = display 12 months 
    vm.updateDisplay = function() { 
     vm.monthsToDisplay = []; 
     if (vm.sixOrTwelve) { 
     vm.monthsToDisplay = months; 
     } else { 
     vm.monthsToDisplay = months.slice(6); 
     } 
    } 
    vm.getSpan = function() { 
     return (vm.sixOrTwelve) ? 13 : 7; 
    } 
    vm.updateDisplay(); 
    }); 
</script> 

我創建了失事plunkr在這裏證明這一點:http://plnkr.co/RTIhnU

取出「COLGROUP」標籤,或者「邊界崩潰」的價值在表格樣式屬性中解決問題。

這是一個已知問題,如果有的話是否有解決方法或修復?

+0

只是爲了補充一點,我幾乎沒有意識到這一點,我沒有着手寫一個控制器,它會使IE崩潰! –

+0

我可以確認崩潰。這似乎是當你再次取消複選框 – mvermand

+0

感謝mvermand我已經添加了指示觸發崩潰 –

回答

2

嘗試this一。

的問題是在這條線:

<col span="{{monthsCtrl.getSpan()}}" />

顯然,合併單元格不能很好地在IE11雙向綁定工作。在用函數getSpan替換變量spanLength並使用單向綁定後,它不再崩潰。