Best solution to Enums in AngularJS?

Question

I'm having trouble finding an elegant solution to Enums and especially searching in Enums with AngularJS.

Let me describe a situation and how I handled it: Say I have an object called Event This event has 2 properties : Severity and Status. Both of which are Enums, defined by ID (1, 2,3) and Title (for Severity : "Light", "Normal", "Important" and for Status : "Open", "Closed", "Pending Approval")

The Event objects that come from the Service have the ID's of the Enums, and when I want to display the object I bind with {{ severityIdToTitle(Event.Severity) }} SeverityIdtoTitle is a method on my controller which calls a method on my service which returns the value of the Enum based on the id recieved The problem arises when I want the user to be able to search the object through text, the AngularJS filter doesn't know the actual "string" value of the Enum, and so I reach my problem.

I know many workarounds around this, and have a few options, but I wonder what would be anelegant and clean solution to this? Did what I do complicate things and there's a better way?

Thanks guys!

Answer 1

Interesting question. I would create a custom filter instead of using the severityIdToTitle function. Filters are designed for formatting data to present to the user, so converting an id to a string is a good use case for one. The filter should depend on a service that knows the two-way mapping between the enum identifiers and their values. As for how to do that mapping, that is a general JavaScript question. There is one good thread about this here.