Sometimes, we want to fix TypeScript enum not working within HTML.
In this article, we’ll look at how to fix TypeScript enum not working within HTML.
How to fix TypeScript enum not working within HTML?
To fix TypeScript enum not working within HTML, we make the enum an instance variable of the component.
For instance, we write
enum Quarters {
Q1,
Q2,
Q3,
Q4,
}
export class AppComponent {
quarter = Quarters.Q1;
Quarters = Quarters;
}
to set Quarters.Q1 to quarters and Quarters to Quarters.
Then in the component’s template we write
<div *ngIf="quarter == Quarters.Q1">I=am only visible for Q1</div>
to use the instance variables in the template.
Conclusion
To fix TypeScript enum not working within HTML, we make the enum an instance variable of the component.
