首先,在创建通用Pipe前,我们需要安装 npm
上的 @angular/compiler-cli
库来解析枚举。可以使用以下命令进行安装:
npm install @angular/compiler-cli --save-dev
接下来,我们可以创建一个通用Pipe,然后将模块的类作为参数传递并传递给 getNames
函数。此函数将返回传递的类中定义的所有键名:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'enumToArray' })
export class EnumToArray implements PipeTransform {
transform(value): Object {
return Object.keys(value).filter((type) => isNaN(type) && type !== 'values').map((key) => value[key]);
}
getNames(enumClass): Array {
return Object.keys(enumClass).filter((type) => isNaN(type) && type !== 'values');
}
}
现在,我们可以在组件中使用这个通用的Pipe来提取任何枚举类的值:
{{ MyEnum | enumToArray }}
这就会返回 MyEnum
枚举类中定义的所有键的值。注意,通用枚举Pipe仅提取键名而不是键值。
上一篇:AngularPipe--Elementimplicitlyhasan'any'typebecauseexpressionoftype'string'can'tbeusedtoindextype