Vượt qua enums trong các mẫu chế độ xem angle2

Chúng ta có thể sử dụng enum trong mẫu khung nhìn angle2 không?

<div class="Dropdown" dropdownType="instrument"></div>

chuyển chuỗi làm đầu vào:

enum DropdownType {
    instrument,
    account,
    currency
}

@Component({
    selector: '[.Dropdown]',
})
export class Dropdown {

    @Input() public set dropdownType(value: any) {

        console.log(value);
    };
}

Nhưng làm thế nào để vượt qua một cấu hình enum? Tôi muốn một cái gì đó như thế này trong mẫu:

<div class="Dropdown" dropdownType="DropdownType.instrument"></div>

Thực hành tốt nhất sẽ là gì?

Đã chỉnh sửa: Đã tạo một ví dụ:

import {bootstrap} from 'angular2/platform/browser';
import {Component, View, Input} from 'angular2/core';

export enum DropdownType {

    instrument = 0,
    account = 1,
    currency = 2
}

@Component({selector: '[.Dropdown]',})
@View({template: ''})
export class Dropdown {

    public dropdownTypes = DropdownType;

    @Input() public set dropdownType(value: any) {console.log(`-- dropdownType: ${value}`);};
    constructor() {console.log('-- Dropdown ready --');}
}

@Component({ selector: 'header' })
@View({ template: '<div class="Dropdown" dropdownType="dropdownTypes.instrument"> </div>', directives: [Dropdown] })
class Header {}

@Component({ selector: 'my-app' })
@View({ template: '<header></header>', directives: [Header] })
class Tester {}

bootstrap(Tester);

Tạo một thuộc tính cho enum của bạn trên thành phần mẹ cho lớp thành phần của bạn và gán enum cho nó, sau đó tham chiếu thuộc tính đó trong mẫu của bạn.

export class Parent {
    public dropdownTypes = DropdownType;        
}

export class Dropdown {       
    @Input() public set dropdownType(value: any) {
        console.log(value);
    };
}

Điều này cho phép bạn liệt kê enum như mong đợi trong mẫu của bạn.

<div class="Dropdown" [dropdownType]="dropdownTypes.instrument"></div>

Tạo một enum

enum ACTIVE_OPTIONS {
    HOME = 0,
    USERS = 1,
    PLAYERS = 2
}

Tạo thành phần của bạn, hãy chắc chắn rằng danh sách enum của bạn sẽ có typeof

export class AppComponent {
    ACTIVE_OPTIONS = ACTIVE_OPTIONS;
    active:ACTIVE_OPTIONS;
}

Tạo chế độ xem của bạn

<li [ngClass]="{'active':active==ACTIVE_OPTIONS.HOME}">
    <a router-link="/in">
    <i class="fa fa-fw fa-dashboard"></i> Home
    </a>
</li>

Nếu bạn muốn lấy tên Enum:

export enum Gender {
       Man = 1,
       Woman = 2
   }

sau đó trong tệp thành phần

public gender: typeof Gender = Gender;

trong mẫu

<input [value]="gender.Man" />

Có lẽ bạn không cần phải làm điều này.

Ví dụ, trong Numeric Enum:

export enum DropdownType {
    instrument = 0,
    account = 1,
    currency = 2
}

Trong Mẫu HTML:

<div class="Dropdown" [dropdownType]="1"></div>

kết quả: dropdownType == DropdownType.account

hoặc Chuỗi Enum:

export enum DropdownType {
    instrument = "instrument",
    account = "account",
    currency = "currency"
}

<div class="Dropdown" [dropdownType]="'currency'"></div>

kết quả: dropdownType == DropdownType.currency

Nếu bạn muốn lấy tên Enum:

val enumValue = DropdownType.currency
DropdownType[enumValue] //  print "currency", Even the "numeric enum" is also.