How can i remove the number spinner in Angular on selected inputs

I have the need to remove the numeric spinner only on a few selected inputs. If i place

/* Chrome, Safari, Edge, Opera */
input[matinput]::-webkit-outer-spin-button,
input[matinput]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}

/* Firefox */
input[matinput][type=number] {
-moz-appearance: textfield;
}


in my styles.scss file the spinner is gone. What I need is a way to apply this only to a select chosen class so I can then apply class to the desired inputs. When i placed that code into a class in the local scss file it didn't work.

Continue reading...