angular - 如何在 ionic 2 中以正确的方式注册订阅者？

Question

我有这个 ionic 2 提供程序:

@Injectable()
export class SettingsProvider {

    settingsData: SettingsDataModel = new SettingsDataModel(2, 2);
    subscriber = null;

    constructor(public http: Http, public storage: Storage) {
        console.log('Hello SettingsProvider Provider');
    }

    load(): void {
        this.storage.ready().then(() => {

            // Or to get a key/value pair
            this.storage.get('settingsData').then((val) => {
                this.subscriber(); // how to notify the subscriber (a differerent typescript class) there was a change the right way in ionic 2?
            });

        })
    }

    save() {
        this.storage.set('settingsData', this.settingsData);
        this.subscriber(); // how to notify the subscriber (a differerent typescript class) there was a change the right way in ionic 2?
    }

    subscribe(callback) { // how to register a subscriber the right way in ionic 2?
        this.subscriber = callback;
    }


}

我已经实现了另一个类想要通过自定义代码(脆弱的代码)订阅和获取通知的能力，另一个类可以以正确的方式订阅它的实现是什么？

Answer 1

为了通知另一段代码，例如另一项服务，您可以公开表示一系列正在进行的事件的可观察属性。我们可以使用 Subject 来做到这一点。

这是它的样子

import { Subject } from 'rxjs/subject';

// singleton can use true privacy.
const settingsEventSource = new Subject<SettingsDataModel>();

@Injectable() export default class SettingsProvider {

  constructor(readonly http: Http, readonly storage: Storage) { }

  get settings$() {
    return settingsEventSource.asObservable(); // prevent others from sourcing events
  }

  settingsData = new SettingsDataModel(2, 2);

  async load() {
    await this.storage.ready();
    try {
      this.settingsData = await this.storage.get('settingsData');
      settingsEventSource.next(this.settingsData);
    }
    catch (e) {
      settingsEventSource.error('Error loading settings.');
    }
  }

  async save() {
    try {
      await this.storage.set('settingsData', this.settingsData);
      settingsEventSource.next(this.settingsData);
    }
    catch (e) {
      settingsEventSource.error('Error saving settings.');
    }
  }
}

订阅者看起来像这样

import SettingsProvider from './settings-provider';
import SetttingsDataModel from './settings-data-model';

@Injectable() export default class SomeService {
  constructor(settingsProvider: SettingsProvider) {
    settingsProvider.subscribe(settings => { 
      this.settings = setttings;
    });
  }
}