typescript – Angular2 – 使用服务在组件之间共享数据

这是第一个组件的来源：

/* app.component.ts */

// ...imports
import {ConfigService} from './config.service';

@Component({
    selector: 'my-app',templateUrl: 'app/templates/app.html',directives: [Grid],providers: [ConfigService]
})
export class AppComponent {
    public size: number;
    public square: number;

    constructor(_configService: ConfigService) {
        this.size = 16;
        this.square = Math.sqrt(this.size);

        // Here I call the service to put my data
        _configService.setOption('size',this.size);
        _configService.setOption('square',this.square);
    }
}

第二部分：

/* grid.component.ts */

// ...imports
import {ConfigService} from './config.service';

@Component({
    selector: 'grid',templateUrl: 'app/templates/grid.html',providers: [ConfigService]
})
export class Grid {
    public config;
    public header = [];

    constructor(_configService: ConfigService) {
        // issue is here,the _configService.getConfig() get an empty object 
        // but I had filled it just before
        this.config = _configService.getConfig();
    }
  }

最后我的小服务,ConfigService：

/* config.service.ts */

import {Injectable} from 'angular2/core';

@Injectable()
export class ConfigService {

    private config = {};

    setOption(option,value) {
        this.config[option] = value;
    }

    getConfig() {
        return this.config;
    }
}

我的数据不是共享的,在grid.component.ts中,_configService.getConfig()行返回一个空对象,但它在app.component.ts之前被填充.

我阅读了文档和教程,没有任何工作.

我失踪了什么

谢谢

解决了

我的问题是我正在注入我的ConfigService两次.在应用程序的引导和在我使用它的文件中.

我删除了提供者的设置和它的工作！