AngularJs 2 – 创建多个服务实例

我创建了AngularJS 2服务，并将其用于2种不同的组件：App-Component&子组件。每个输出属性“log”(一个字符串)我的服务。

Stateservice类：

@Injectable ()
class Stateservice {

    public log : String;
    static count : number = 0;

    constructor () {
        this.log = '';
        Stateservice.count++;
        this.writeToLog ('CREATED '+Stateservice.count+' at ' + new Date().toString());
    }

    public writeToLog (text : String) : void {
        this.log += text + '\n';
    }
}

零件 ：

@Component ({
    SELEctor : 'Sub-Component',template : `<hr>
            This is the Sub-Component !
            <BR>
            Stateservice Log : 
            <pre>{{ _stateservice.log }}</pre>
            <button (click)="WriteToLog ()">Write to log</button>
            `,providers : [Stateservice]
})

export class SubComponent {
    constructor (private _stateservice : StateservicE) {
    }

    public WriteToLog () : void {
        this._stateservice.writeToLog ('From Sub-Component - This is '+new Date().toString());
    }
}

代码here的实例

除了服务创建一次，当每个组件调用WriteToLog方法时，输出在每个组件中是相同的，但不是。

输出示例：

App-Component可以输出以下内容：

子组件可以输出：

所以看起来服务的2个实例被创建(实例1的实例2)

我只想要一个实例;)，当我在日志中追加字符串时，这必须出现在两个组件中。

感谢您的帮助

@NgModule({ providers: [...],...

@Component ({
    SELEctor : 'Sub-Component',// providers : [Stateservice] <== remove
})

bootstrap(AppComponent,[Stateservice]);