How to show different string for enums Angular 4 typescript

Question

I have a string based enum. Without changing the enum class, I need to display different strings on my modal. My obj contains the enum. My code is as follows:

ENUM:

  export enum FooEnum {
        ONE,
        TWO,
        THREE
    }

HTML:

<select class="form-control"
                    type="text"
                    id="foo"
                    [(ngModel)]="obj.foo"
                    required
                    name="foo"
                    #foo="ngModel">
              <option *ngFor="let foo of fooToList()" [ngValue]="foo">{{foo}}</option>
            </select>

TypeScript:

  fooToList(): Array<string> {
    const keys = Object.keys(FooEnum);
    return keys.slice(keys.length / 2);
  }

I would like to view ONE as Un, TWO as Deux etc. Could you help me pretty please ?

Note: I included angular 2 also because 2 and 4 are highly similar.

Lyubomir · Accepted Answer · 2017-10-12 13:15:55Z

10

You can initialise enums with values too such as

enum FooEnum { 
  ONE = 'Un',
  TWO = 'Deux',
  ... etc
}

See documentation.

Note: This was introduced in TypeScript 2.4

edited Oct 12, 2017 at 13:15

answered Oct 12, 2017 at 12:27

Lyubomir

20.1k6 gold badges59 silver badges71 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Lyubomir Over a year ago

I don't understand, this should work, see here typescriptlang.org/play/…

Lyubomir Over a year ago

... and click run. What's your setup? Maybe it's just the IDE that is not configure properly. The code should work.

Red fx Over a year ago

you are right it should work as it is on the link you've shared but I dont understand really why it doesnt

Red fx Over a year ago

I have seen that the version of typescript used in the project is older that they have put this feature; I will be trying to update the project.

Lyubomir Over a year ago

yes, typescript prior to 2.4 didn't have this feature. I've updated my answer.

|

Collectives™ on Stack Overflow

How to show different string for enums Angular 4 typescript

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related