How to dynamically load an icon using string name?

[davoutuk]

This is for an Angular 10 app.

How can I dynamically load an icon if I pass in a string value that represents the icon name?

For instance, if my string variable is ...

const iconName = 'faTasks'

How do I translate that text variable into an 'IconDefinition'?

[devoto13]

If you know a subset of icons you want to load this way, you should be able to add them to the FaIconLibrary, then inject instance of the library and call FaIconLibrary.getIconDefinition().

If you want to load any icon, you can do something like below. Note that this will include all icons in your application bundle and will likely influence performance.

import { fas } from '@fortawesome/free-solid-svg-icons';
console.log(fas[iconName]);

[devoto13]

Closing as answered.