Angular2组件输入具有特定值

Question

您好我有一个简单的问题。我的组件有一个输入，我想指定如何插入值。

export class MyComponent{
  @Input() type: string; //only active, disable...
}

可以说输入值的有效性如何？感谢

Answer 1

一种方法是验证属性setter

中的输入值

 export class MyComponent{
      private _type: string; //only active, disable...


        get type(): string{
            return this._type;
        }

        @Input() set type(value: string) {
            if(['active', 'disable'].indexOf(value) !== -1) 
              this._type = value;
            else
              // take action        
        }
}

Answer 2

您可以使用枚举

https://www.typescriptlang.org/docs/handbook/enums.html

做类似的事情：

enum State {
    Active,
    Disabled
}

在组件上

@Input() type: State;