是否可以用角度元数据注释数据模型？

Question

我有一个简单的数据模型，我想用元数据进行注释

export class Certification {
    title: string;
    certificationType?: CertificationType;
    validTo?: number;
    description?: string;
    externalIdentifier: Guid;

    constructor() {
        this.title = '';
        this.certificationType = CertificationType.Undefined;
        this.validTo = 0;
        this.description = '';
        this.externalIdentifier = null;
    }
}

我希望我能以某种方式对模型进行注释

export class Certification {
    @Heading() 
    title: string;
    certificationType?: CertificationType;
    @Label('My label') 
    validTo?: number;
    description?: string;
    @Hidden()
    externalIdentifier: Guid;

    constructor() {...}
}

我有很多非常相似的模型，所以我更愿意创建一个简单的组件来处理所有这些的显示逻辑，而不是为每个模型创建一个组件，然后由每个单独的模板控制差异。

我尝试使用 typescript 文档中定义的反射元数据 api，如下所述：https://www.typescriptlang.org/docs/handbook/decorators.html#property-decorators 但即使元数据在构建时应用于模型，当我通过绑定分配它时，它们似乎也会丢失。

<display-annotated-model [model]="certification"></display-annotated-model>

所以我的问题是有没有人得到这个工作？

或者是否有不同的方法来注释我应该查看的数据模型（我已经用尽了我的谷歌搜索能力）？

我需要让它在 Angular 9 中工作。感谢任何输入:)

Answer 1

这是可能的。最初的注释计划会使这非常有用。不幸的是，这些注释变成了装饰器。作为装饰器，关于它们正在装饰的属性的任何元数据都存储在全局装饰器存储中。

Angular 本身在编译时将其内置的装饰器（@Component()、@Directive()、@Pipe()、NgModel()、@Injectable() 等）转换回注解。

注解和装饰器有什么区别？

注释只是元数据，并存储在对象的实例中（取决于您要注释的内容）。

装饰器是可以修改属性访问器、方法、类的包装器——以及为每个属性访问器、方法或类提供元数据。

由于装饰器的这种动态特性，编译器无法判断底层代码是否可以安全地摇树。

因此，装饰器在大多数情况下不适合浏览器代码。尽管可以为自定义装饰器创建自定义编译器插件——这基本上可以做 Angular 为其装饰器所做的事情。

我感兴趣的另一种方法是能够添加元数据做一个 ReactiveForm 声明。

这是一个类似的例子：https://github.com/martinmcwhorter/modelmetadata