我正在使用Angular FontAwesome包来处理我的项目中的图标.
根据文档,我可以从我的组件中呈现这样的图标:
...
import { faSignOut } from '@fortawesome/free-solid-svg-icons';
...
export class MyComponent implements OnInit {
@HostBinding('class') classes = 'h-full';
faSignOut = faSignOut;
...
}
我的模板如下所示:
<fa-icon [icon]="faSignOut" class="h-6 w-6 text-gray-300 transition duration-75 ease-linear group-hover:text-white"></fa-icon>
图标已渲染,但tailwind 类放置在<fa-icon>
上.
我可以手动对项目进行编码,但我希望通过循环将图标的名称从我的组件传递到我的模板.
如何将h-6 w-6
类从<fa-icon>
传递到生成的svg?
例如:
<fa-icon class="ng-fa-icon">
<svg class="h-6 w-6 text-gray-300 transition duration-75 ease-linear group-hover:text-white">...</svg>
</fa-icon>