Angular Material icons not working

Question

I\'ve installed Material for angular,

I\'ve imported on my app module MatIconModule (with import { MatIconModule } from \'@angular/material/icon\';)

Answer 1

I ran into the issue of icons not displaying for me. I had followed the steps provided by Basavaraj Bhusani however still not working.

I found the issue was that in my scss, I had the text-transform: uppercase which was causing the icon to just display the content 'arrow_forward'. I had to change the text-transform: none on the icon specifically otherwise it would not render.

                .child-item-action {

                    text-transform: uppercase;

                    &:after {

                        font-family: 'Material Icons';
                        content: "arrow_forward";
                        text-transform: none;
                        -webkit-font-feature-settings: 'liga';

                    }