Primeng 数据表中的自定义加载图标答案

【问题标题】：Custom loading icon in primeng datatablePrimeng 数据表中的自定义加载图标
【发布时间】：2017-10-07 18:28:29
【问题描述】：

在我的 angular 4 项目中，我有一些primeng 数据表，我想在加载表时使用自定义加载图标。但是我不知道如何在项目中使用自定义图标，我从loading.io下载了图标，我需要css版本还是svg版本？

在 Primeng 我看到有这个默认图标我的怎么能这样放？

【问题讨论】：

【解决方案1】：

在http://fontawesome.io/icons/寻找你想显示的图标

示例：fa-spinner 是以下图标 http://fontawesome.io/icon/spinner/ 的 css 类

在您的模板中，添加 loadingIcon 属性：

<p-dataTable [value]="values" [loadingIcon]="fa-spinner">
    ...
</p-dataTable>

【讨论】：

如果您只想更改样式，请检查 DOM 以了解如何访问 css 中的图标。然后在styles.css中添加样式。例如，在您的 styles.css 添加： .fa-circle-o-notch{color:red;}
我想使用自定义图标
来自图像 (png) 还是来自字体？
我有自定义图标的css和svg文件，可以用吗？
您可以尝试使用自定义 css 类： [loadingIcon]="customClass" 然后在 styles.css 中： .customClass{background-image:"path/to/your/icon";}