寬度在IE

Question

我的指令，完全在Chrome，但不是在IE8不改變：

app.directive('barMax', function ($compile) { 
    return { 
     restrict: 'E', 
     scope: { 
      current: '=', 
      max: '=' 
     }, 
     link: function postLink(scope, element, attrs) { 
      scope.$watch('max', function (newValue) { 
       var newContent = ''; 
       newContent += '<div class="bottom" style="width:{{max*2}}px;">&nbsp;</div><div class="mid" ng-class="{greater: current >= max, less: current < max}" style="width:{{current*2}}px;">&nbsp;</div><div class="top" style="height:17px;"><div style="width:41%;float:left;margin-top:2px;margin-left:2px;"></div><div style="float:left;width:50%;margin-top:2px;"></div></div>'; 
       element.append($compile(newContent)(scope)); 
      }); 
     } 
    }; 
}); 

在IE中會發生什麼事是......例如以前可能最大：100和電流：100，則灰色條的寬度爲100px，彩色條的寬度爲100px。由於電流等於max，所以彩色條的顏色將是綠色，然後我將scope.changeability更新爲max：130和current：90，所以我應該預計灰色條的寬度爲130px，彩條應該有90px的寬度，但寬度不會更新。顏色是正確的。問題是寬度，因爲它沒有更新。

我還添加了填充工具

<!--[if lte IE 8]> 
    <script> 
     document.createElement('bar-max'); 
    </script> 
<![endif]--> 

Answer 1

IE犯規讓不熟悉的標籤，併爲此作爲標籤，如您可能無法使用指令。您必須使用限制「A」並將其用作已知html標記中的屬性。如果你不想在包裝標籤使用替換：真的是這樣

return { 
     restrict: 'A', 
     replace:true, 
     scope: ..., 
     link:... 

您可以看到，這裏https://skydrive.live.com/redir?resid=949DC4EDBFFD4738!189&authkey=!ABZCTBTTOCDYGhk