將數據從一個組件傳遞到另一個角度時的服務變量2

Question

我試圖將一個組件的變量傳遞給另一個組件。我做的，通過使用一項服務：如果數據獲取功能而改變

import { Injectable } from '@angular/core'; 
    import { Subject } from 'rxjs/Subject'; 


    @Injectable() 
    export class SharedService { 
     // private questionNumber = new Subject<number>(); 
     // questionNumber$ = this.questionNumber.asObservable(); 
     questionNumber : number; 
     publishData(number:number) { 
     this.questionNumber = number; 
     console.log(this.questionNumber,'publish'); 
     } 

    getQuestionData(){ 
    console.log(this.questionNumber,'get'); 
    return this.questionNumber; 
    } 

    constructor() { } 

} 

「publishData」它在控制檯將當前變量值：

但如果我嘗試如同其不改變

組分1（E訪問該變量它仍然是不確定的xcerpt）：

import { Component, OnInit } from '@angular/core'; 
import { ViewEncapsulation } from '@angular/core'; 
import { SharedService } from '../shared.service'; 

@Component({ 
    selector: 'app-main-quiz', 
    templateUrl: './main-quiz.component.html', 
    styleUrls: ['./main-quiz.component.css'], 
    encapsulation: ViewEncapsulation.None, 
    providers: [SharedService] 
}) 
export class MainQuizComponent implements OnInit { 

    constructor(private _sharedService: SharedService){ 
    this._sharedService = _sharedService; 
    } 

    updateQuestion(){ 
    this._sharedService.publishData(this.questionNumber); 
    }; 

子項目2：

import { Component, OnInit, Input } from '@angular/core'; 
import { ViewEncapsulation } from '@angular/core'; 
import { SharedService } from '../shared.service'; 

@Component({ 
    selector: 'app-win-page', 
    templateUrl: './win-page.component.html', 
    styleUrls: ['./win-page.component.css'], 
    encapsulation: ViewEncapsulation.None, 
    inputs: ['questionNumber'], 
    providers: [SharedService] 
}) 
export class WinPageComponent implements OnInit { 

    constructor(private _sharedService : SharedService) { 
    this._sharedService = _sharedService; 
    this.questionNumber = this._sharedService.getQuestionData(); 
    } 

    questionNumber : number; 

    ngOnInit() { 

    } 

    ngOnChanges(){ 
    this.questionNumber = this._sharedService.getQuestionData(); 
    } 

} 

爲什麼不變量更新？

感謝您的幫助！

Answer 1

如這裏已經回答：Angular - shared service between components doesn't work

每個組件有：

providers: [SharedService] 

因此，基於角DI Hierachy該服務將僅適用於電流分量。 在你的情況下，這意味着每個組件將有他自己的實例（service isolation）。

如果你希望你的組件來共享你需要聲明在模塊級的供應商相同的實例。