Question

使用（fa）之前的版本（4），图标在app.layout.isSmallSidebar变量更改后成功更新，但现在（veriosn 5）它没有。它似乎与渲染方式有关......

任何想法为什么？以及如何解决这个问题？

提前致谢！

Answer 1

Font Awesome 5适用于ng-class：

＆＃13;

    <link href="//use.fontawesome.com/releases/v5.0.1/css/all.css" rel="stylesheet">
    <script src="//unpkg.com/angular/angular.js"></script>
  <body ng-app>
    <fieldset>
     <i class="fa" ng-class="{'fa-times': selClose,
                              'fa-image': !selClose}">
       
     </i>
     Selectable icon
    </fieldset>
    <input type=checkbox ng-model="selClose">Select close icon
    <fieldset>
     <i class="fa fa-times"></i>
    </fieldset>
    <fieldset>
     <i class="fa fa-image"></i>
    </fieldset>
  </body>

＆＃13;

Answer 2

我一直在寻找同样的解决方案（我认为）几天。事实上，没有NG标签似乎适用于FA5，我相信我已经找到了原因。根据FA5安装说明，您将包含一个js脚本来代替样式表。 js脚本在运行时将所有新的FA图标更改为SVG，从而更改其对dom的引用。这使得您的NG标签适用于不再存在的内容。

解决方案包括：

<link href="//use.fontawesome.com/releases/v5.0.1/css/all.css" rel="stylesheet">

而不是我怀疑你正在使用：

<script defer src="https://use.fontawesome.com/releases/v5.0.9/js/all.js" integrity="sha384-8iPTk2s/jMVj81dnzb/iFR2sdA7u06vHJyyLlAd4snFpCl/SnyUjRrbdJsw1pGIl" crossorigin="anonymous"></script>

这就是georgeawg在他的样本中使用的原因以及它的工作原理。

我的新字体awesome（5.0）图标没有使用ng-class进行更新

2 个答案: