Question

我们可以使用ngstyle在对象中包含字体真棒图标吗？我们如何在HTML中绑定它们？

我尝试了以下代码，但它对我不起作用：

$scope.Items = [
 obj: {data:65476756,right:12344,title:"Income"},object:{ "font-size" : "20px", "text-align":"center" ,"icon":"fa fa-level-up"}]

我的HTML看起来像这样：

<div my-widget data="item.obj" ng-style="item.object"> 
</div>

Answer 1

ng-style期望对象键是CSS样式名称，值是这些CSS键的对应值。由于没有名为icon的CSS样式，因此它会被忽略。 fa fa-level-up是CSS类，它们应该像类一样使用。

所以你需要改变你的JS代码，如：

$scope.Items = [{
 obj: {data:65476756,right:12344,title:"Income"},
 object:{ "font-size" : "20px", "text-align":"center"},
 classes:"fa fa-level-up"
}]

然后在HTML中使用它：

<div my-widget data="item.obj" ng-style="item.object" ng-class="item.classes"> 
</div>

注意：item.classes是字符串。参考：https://docs.angularjs.org/api/ng/directive/ngClass

修改

要回答有关大小，颜色，位置的问题：您可以使用标准CSS样式。有关详细信息，请访问以下链接：https://fontawesome.com/v4.7.0/examples/

如果更改图标容器的字体大小，则会显示图标大。颜色，投影和其他任何东西都是一样的使用CSS继承。

或者您也可以使用fa-2x ... fa-5x等类。

如何使用Ngstyle或ngclass在对象中包含字体真棒图标

1 个答案: