如何在没有装饰器的情况下将 Angular2 与 ES6 一起使用？

Question

Following the ES5 quickstart on the Angular 2 website I get something along the lines of:

mycomponent =
    ng.core.Component({
        ...
    })
    .Class({
        constructor: function() {}
    });

I am wondering how I can swap out the .Class method for a proper ES6 class but without using decorators (as they are not yet part of an ES standard)

Answer 1

You could use a getter for the annotations property with the ComponentMetadata class, as described below:

import {ComponentMetadata,Inject} from 'angular2/core';
import {FormBuilder} from 'angular2/common';

export class AppComponent {
  constructor(fb) {
    console.log(fb);
  }

  static get parameters() {
    return [[FormBuilder]];
  }

  static get annotations() {
    return [
      new ComponentMetadata({
        selector: 'my-app',
        template: `
          <div>
            Test
          </div>
        `
      })
    ];
  }
}

See this plunkr: https://plnkr.co/edit/VqDSDuroK29iAxGzA5Lc?p=preview

You can notice that tools like Babel support decorators.