Osservazione di una modifica in una proprietà dell'oggetto in Angular 2

Question

Mi sono recentemente spostato in Angular 2 da Angular 1 e spesso incappato in problemi che tentano di rilevare le modifiche nella proprietà di un oggetto (un'operazione eseguita in precedenza tramite $ watch).

Il tipico caso d'uso è che avrò un servizio iniettabile che mantiene un pezzo di dati, ad esempio un oggetto contenente le impostazioni:

@Injectable() 
export class SettingsService 
{ 
    _settings = { 
     'settingA' : true, 
     'settingB' : false 
    } 

    ... 

    get settings() 
    { 
     return this._settings; 
    } 
} 

mi avrà quindi un componente, ad esempio una pagina impostazioni un app ionico che otterrà le impostazioni dal servizio di configurazione:

constructor(private settingsService : SettingsService) 
{ 
    this.settings = settingsService.settings; 
} 

e direttamente paio le proprietà degli oggetti ad un componente dell'interfaccia utente come un toggle. Il problema è diverso dal chiamare una funzione su ogni evento di commutazione toggle come può il servizio o il componente sapere che l'oggetto delle impostazioni è stato modificato per attivare un'azione appropriata come salvare le impostazioni in un archivio dati?

Answer 1

Per creare un servizio di dati osservabili, è possibile utilizzare BehaviorSubject da rxjs. Crei un argomento nel tuo servizio e quindi devi sottoscrivere questo argomento nei tuoi componenti.

Dai un'occhiata qui per alcuni tutorial sulla creazione di servizi con esso: example 1, example 2.

Hai teoricamente l'opportunità di utilizzare EventEmitter nel tuo servizio. Ma non dovresti usarlo. Dai un'occhiata a questo answer per maggiori dettagli. In questa risposta puoi trovare anche un esempio su come risolverlo usando Observable invece di BehaviorSubject