Angularjs IE中的字体样式问题

我正在使用angular指令创建一个包含字体的列表

<li  ng-repeat='o in options'><button class='btn btn-blue checked-dropdown' style='font-family: {{o.css}}; width: 100%' type='button' ng-click='action($event, o.css)'><i ng-if='o.active' class='fa fa-check'></i>{{o.name}}</button></li>

  options: [
            { name: 'Sans-Serif', css: 'Arial, Helvetica, sans-serif' },
            { name: 'Serif', css: "'times new roman', serif" },
            { name: 'Wide', css: "'arial black', sans-serif" },
            { name: 'Narrow', css: "'arial narrow', sans-serif" },
            { name: 'Comic Sans MS', css: "'comic sans ms', sans-serif" },
            { name: 'Courier New', css: "'courier new', monospace" },
            { name: 'Garamond', css: 'garamond, serif' },
            { name: 'Georgia', css: 'georgia, serif' },
            { name: 'Tahoma', css: 'tahoma, sans-serif' },
            { name: 'Trebuchet MS', css: "'trebuchet ms', sans-serif" },
            { name: "Helvetica", css: "'Helvetica Neue', Helvetica, Arial, sans-serif" },
            { name: 'Verdana', css: 'verdana, sans-serif' },
            { name: 'Proxima Nova', css: 'proxima_nova_rgregular' }
        ]

{{o.name}
选项：[
{name:'Sans Serif'，css:'Arial，Helvetica，Sans Serif'}，
{名称：'Serif'，css:'times new roman'，Serif'}，
{name:'Wide'，css:'arial black'，sans serif'}，
{name:'shown'，css:'arial shown'，sans serif'}，
{名称：'Comic Sans MS'，css:'Comic Sans MS'，Sans serif'}，
{name:'Courier New'，css:'Courier New'，monospace}，
{name:'Garamond'，css:'Garamond，serif'}，
{name:'Georgia'，css:'Georgia，serif'}，
{name:'Tahoma'，css:'Tahoma，sans serif'}，
{名称：'Trebuchet MS'，css:'Trebuchet MS'，无衬线“}，
{名称：“Helvetica”，css:“Helvetica Neue”，Helvetica，Arial，无衬线“}，
{name:'Verdana'，css:'Verdana，sans serif'}，
{name:'Proxima Nova'，css:'Proxima_Nova_rgregular'}
]

当我点击按钮，然后完整的字体列表显示与他们的css应用于它。 它在Chrome中运行良好，但在IE中，只有字体名称以纯文本显示

---

您可以使用ng style指令并调用ng style上的函数，而不是将模型值附加到style attr中的特定属性：

ng style=“mystyle（$index）”

$scope.mystyle = function(index){
      return {
        'font-family': $scope.options[index].css,
         'width': "100%"
      }
    }