Using Enum Values in Angular Templates


We want to use these enum values:

export enum SocialMediaType {

As input values for our Angular SocialIconComponent like this:

<fs-social-icon [topic]="topic" [type]="SMT.TWITTER"></fs-social-icon>


In order to gain access to the enum values in the app.component.html template we need to create a reference to the SocialMediaType within the AppComponent.

public SMT = SocialMediaType;

We can now use use this reference to set the input:

<fs-social-icon [topic]="topic" [type]="SMT.TWITTER"></fs-social-icon>


Brought to You By



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ole Ersoy

Ole Ersoy

Founder of Firefly Semantics Corporation