Angular: Parse custom typescript decorators

Question

I want to use Typescript decorators to define a mapping for my backend service/model parameters to frontend class parameters in my Angular project. I cannot change the backend and I don't want to use the names for my frontend code.

An example for my typescript model definition:

export class Person {
  @Param('NAME1')
  firstName: string;

  @Param('NAME2')
  lastName: string;
}

The data received from the backend looks like this:

{
  "NAME1": "John",
  "NAME2": "Doe"
}

Now I want to write a compiler hook which analyses all those @Param decorators and generates a JSON file with the mappings:

{
  "Person": {
    "NAME1": "firstName",
    "NAME2": "lastName"
  }
}

Later, my services will use this mapping-file to parse the backend responses.

In the backend "world" (Java, PHP, etc.) this is a very typical use of annotations, i.e. annotations are used just like above to define mappings between database tables/web services and entity classes.

How can I achieve this with Angular? My goal is that the mapping JSON file is generated automatically on compiler invocation. Can I define some sort of compiler hook? Are there examples or even ready solutions (I could imagine there are others with similar requirements)?

Angular: Parse custom typescript decorators

0 Answers