Font Awesome not working when binding icon in Angular

552 Views Asked by At

I have created a div which content is editable. The user can insert a phone number just by pressing a button click; The whole process is working, but the main issue is with phone icon inserted using font awesome library. The span appears normally except the icon which when binding is applied, thus the same span appears and icon is displayed successfully when html page is loaded.

How can I solve this issue and make icons appear successfully if they are bind? Note multiple spans can be added (there are many others for Location and Web URL).

My example is here

1

There are 1 best solutions below

1
On

You have to call the method dynamically to force icon rendering. Here is working example.