宽度在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