ES5和ES6中的Angular 2依赖注入

Question

这是一个基本的TypeScript / ES.next示例，该示例使用装饰符进行DI并遵循框架手册建议的语法：

import {Component, Inject, Injectable, NgModule, OpaqueToken} from '@angular/core';

import {BrowserModule} from '@angular/platform-browser';

import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';

const CONSTANT = { value: 'constant' };

const CONSTANT_TOKEN = new OpaqueToken;

const CONSTANT_PROVIDER = { provide: CONSTANT_TOKEN, useValue: CONSTANT };

@Injectable()

class Service {

  constructor(@Inject(CONSTANT_TOKEN) constant) {

    console.log('Service constructor', constant);

  }

}

@Component({

  selector: 'app',

  template: '...',

  providers: [Service, CONSTANT_PROVIDER]

})

class AppComponent {

  constructor(@Inject(Service) service: Service, @Inject(CONSTANT_TOKEN) constant) {

    console.log('AppComponent constructor', service, constant);    

  }

}

@NgModule({

  imports: [BrowserModule],

  declarations: [AppComponent],

  bootstrap: [AppComponent]

})

class AppModule {}

platformBrowserDynamic().bootstrapModule(AppModule);

如何用ES5编写？

如何将同样的事情在做untranspiled ES6 / ES2015？

在这种情况下Injectable，Inject装饰器如何翻译？

该问题尤其适用于具有类但可以使用require或System.import代替ES6导入的具有类的真实ES6浏览器实现。