Angular2 use enum value in html value attribute

Question

I am trying to use an enum value to set the selected value of an HTML attribute:

export enum MyEnum {     FirstValue,     SecondValue } export function MyEnumAware(constructor: Function) {     constructor.prototype.MyEnum = MyEnum; }  @MyEnumAware @Component({     templateUrl: "./lot-edit.component.html",     styleUrls: ["./lot-edit.component.css"], }) export class LotEditComponent implements OnInit {     @Input() myEnumValue: MyEnum ; 

}

<td><input name="status" type="radio" [value]="MyEnum.FirstValue" [(ngModel)]="myEnumValue"></td> <td><input name="status" type="radio" [value]="MyEnum.SecondValue" [(ngModel)]="myEnumValue"></td> 

however I get "Cannot read property 'FirstValue' of undefined"

Is there a way to use an enum value as the value of html attributes?

Answer 1

Your template can only access member variables of its component class. So, if you want to use the enum's values, assign it (the Enum) to a member variable.

In your component,

export class MyComp {   MyEnum = MyEnum;   ..... }    

Then you're free to access the elements of the enum in your template.