Angular2檢測服務中的變化

Question

我在Angular2中有一個組件，它正在改變服務translate.service.ts中的「lang」類變量。在另一個組件中，我使用init中的翻譯來獲取字典。如果第一個組件稍後更改了服務語言，我想要自動在第二個組件中重新獲取該詞典。我怎麼做？

第一部分：

setLang(lang) { 
    this._translateService.setLang(lang); 
    } 

服務：

dict = { "en": {}}; 
lang = "en"; 

setLang(lang) { 
    this.lang = lang; 
} 

getLang() { 
    return this.dict; 
} 

第二部分：

ngOnInit() { 
    this.dict = this._translateService.getDict(); 
} 

Answer 1

你應該在服務中使用的EventEmitter：

export class LangService { 
    langUpdated:EventEmitter = new EventEmitter(); 

    setLang(lang) { 
    this.lang = lang; 
    this.langUpdated.emit(this.lang); 
    } 

    getLang() { 
    return this.dict; 
    } 
} 

組件可以訂閱此事件以在lang屬性更新時得到通知。

export class MyComponent { 
    constructor(private _translateService:LangService) { 
    } 

    ngOnInit() { 
    this._translateService.langUpdated.subscribe(
     (lang) => { 
     this.dict = this._translateService.getDict(); 
     } 
    ); 
    } 
} 

詳情請參見這個問題：

• Delegation: EventEmitter or Observable in Angular2
• Delegation: EventEmitter or Observable in Angular2

編輯

繼Mark的評論，一個Subject/Observable應首選：

EventEmitter應該僅被用於發光元件的自定義活動，並且我們應該使用的Rx爲其他可觀察/事件場景。