Una solución más si no desea crear una nueva tubería. También puede extraer claves en la propiedad auxiliar y usarla:

 @Component({ selector: 'my-app', providers: [], template: ` <div> <select> <option *ngFor="let key of keys" [value]="key" [label]="countries[key]"></option> </select> </div> `, directives: [] }) export class App { countries = CountryCodeEnum constructor() { this.keys = Object.keys(this.countries).filter(k => !isNaN(Number(k))); } }

Demostración: http://plnkr.co/edit/CMFt6Zl7lLYgnHoKKa4E?p=preview

Editar:

si necesita las opciones como números en lugar de cadenas:

• reemplazar [value] con [ngValue]
• agregar .map(Number) después de .filter(...)

update2 simplificado mediante la creación de una matriz

 @Pipe({name: 'enumToArray'}) export class EnumToArrayPipe implements PipeTransform { transform(value) : Object { return Object.keys(value).filter(e => !isNaN(+e)).map(o => { return {index: +o, name: value[o]}}); } } @Component({ ... imports: [EnumsToArrayPipe], template: `<div *ngFor="let item of roles | enumToArray">{{item.index}}: {{item.name}}</div>` }) class MyComponent { roles = Role; }

actualizar

en lugar de pipes: [KeysPipe]

usar

 @NgModule({ declarations: [KeysPipe], exports: [KeysPipe], } export class SharedModule{}

 @NgModule({ ... imports: [SharedModule], })

original

Usando la tubería de keys de https://stackoverflow.com/a/35536052/217408

Tuve que modificar un poco la canalización para que funcionara correctamente con las enumeraciones (consulte también ¿Cómo obtener nombres de entradas de enumeración? )

 @Pipe({name: 'keys'}) export class KeysPipe implements PipeTransform { transform(value, args:string[]) : any { let keys = []; for (var enumMember in value) { if (!isNaN(parseInt(enumMember, 10))) { keys.push({key: enumMember, value: value[enumMember]}); // Uncomment if you want log // console.log("enum member: ", value[enumMember]); } } return keys; } } @Component({ ... pipes: [KeysPipe], template: ` <select> <option *ngFor="let item of countries | keys" [value]="item.key">{{item.value}}</option> </select> ` }) class MyComponent { countries = CountryCodeEnum; }

Plunker

Ver también ¿Cómo iterar claves de objetos usando *ngFor?

Aquí hay una forma muy sencilla para Angular2 v2.0.0. En aras de la exhaustividad, he incluido un ejemplo de configuración de un valor predeterminado de selección de country a través de formularios reactivos .

 @Component({ selector: 'my-app', providers: [], template: ` <div> <select id="country" formControlName="country"> <option *ngFor="let key of keys" [value]="key">{{countries[key]}}</option> </select> </div> `, directives: [] }) export class App { keys: any[]; countries = CountryCodeEnum; constructor(private fb: FormBuilder) { this.keys = Object.keys(this.countries).filter(Number); this.country = CountryCodeEnum.Belgium; //Default the value } }