使用TypeScript,Angular 2和SystemJS进行基于接口的编程

我目前正在尝试清理一些代码,以便针对接口而不是针对实现进行编程,但无法弄清楚如何实现.

更具体地说,我正在使用:
* TypeScript 1.5.0 beta – >转换为ES5 / commonjs
* SystemJS加载模块

我目前尝试使用外部模块如下:

posts.service.ts文件

///<reference path="../../../typings/tsd.d.ts" />
///<reference path="../../../typings/typescriptApp.d.ts" />
...
export interface PostsService{ // 1
    fetchPosts(): Rx.Observable<any>;
}
export var PostsService:PostsServiceImpl; // 2
...
export class PostsServiceImpl implements PostsService { // 3
    ...
    constructor(){
        console.log('Loading the Posts service');
}
...
fetchPosts(): Rx.Observable<any>{ 
   ...
}

并在posts.ts中导入该模块:

///<reference path="../../../typings/tsd.d.ts" />
    ///<reference path="../../../typings/typescriptApp.d.ts" />

    import {PostsService,PostsServiceImpl} from 'components/posts/posts.service';

    @Component({
    selector: 'posts',viewInjector: [
        //PostsServiceImpl
        //PostsService
        bind(PostsService).toClass(PostsServiceImpl)
    ]
})
...
export class Posts {
    private postsServices: PostsService;

    constructor(postsService: PostsService) {
        console.log('Loading the Posts component');
        this.postsServices = postsService;
        ...
    }

    ...
}

上面的代码编译正确,但基本上我的问题归结为Angular不会在Posts组件中注入PostsServiceImpl的实例.

当然这只是因为我没有找到正确的方式来声明/导出/导入所有内容

没有导出接口PostsService …,我得到TS编译错误,因为我在posts控制器中使用它.

没有export var PostsService:PostsServiceImpl;我在@View装饰器的viewInjector中得到TS编译错误

生成的js代码中我只找到exports.PostsService;由于export var而添加的…我知道接口在运行时消失了.

所以我有点迷失了.任何实用的想法如何使用基于接口的编程w / TypeScript&角2?

Any practical ideas how I can use interface based programming w/ TypeScript & Angular 2

接口在运行时被擦除.事实上,装饰器也不支持接口.因此,最好使用在运行时存在的东西(即实现).

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...