Imprfectluck Imprfectluck - 10 days ago 5
AngularJS Question

Access Enum properties in angular js select drop down

I have an enum in java like so

public enum myEnum{
enum1("enumDisplayVal1"), enum2("enumDisplayVal2")
myEnum(String displayValue) { this.displayValue = displayValue;}

private String displayValue;
public String getDisplayValue(){return displayValue}
}


In Angular js I create a select dropdown with the enum .

<select class="multiselect" multiple="multiple" id="enumDropDown"
data-ng-change="update()"
data-ng-options="e for e in myEnumValues"
data-ng-model="selectedEnum">
<option value="">All</option>
</select>


The dropdown shows values like enum1 ,enum2 which are the actual values of the enum. How can I make it so that it shows the "displayValue" property of the enum in the select dropdown.

I send the values of enum to angular js using
myEnum.values()

Answer

This is what I ended up doing . Created a map of the enum values() like so,

 Arrays.stream(myEnum.values()).collect(toMap(i -> i.name(), i -> i.getDisplayValue())

On the Angular js side :

 <select class="multiselect"  data-ng-change="update()"
                data-ng-options="key as value for (key, value) in myEnumValues"
                data-ng-model="selectedEnum">
                <option value="">All</option>
   </select>

Solved the issue of having a separate display name and different values.