CODEWITHSUNDEEP
javascriptangular
hellzone
hellzone

Reputation: 5246

How to use enum within HTML?

When I reference to an enum value I am getting below error.

ERROR TypeError: Cannot read property 'Text' of undefined

Is there any way to use this enum within html part of component?

My Enum;

 export enum InputType {
    Text = "text",
    Number = "number",
    Color = "color"
}

My component;

export class AppComponent {
  title = 'app';

  inputType : InputType;

}

html part;

<app-input [inputType]="inputType.Text"></app-input>

Upvotes: 0

Views: 84

Answers (1)

briosheje
briosheje

Reputation: 7446

Change:

export class AppComponent {
  title = 'app';

  inputType : InputType;

}

to:

export class AppComponent {
  title = 'app';

  inputType = InputType;

}

Otherwise, inputType will be treated by typescript as an InputType, but will never be assigned, hence it will be undefined at runtime (and angular will throw the exception as stated above, since it's trying to access a property of an undefined component property).

Upvotes: 2

Related Questions