angular - 观察 Angular 2 中对象属性的变化

Question

我最近从 Angular 1 转移到 Angular 2，并且经常在尝试检测对象属性的变化时遇到问题(以前通过 $watch 完成的事情)。

典型的用例是我将有一个可注入(inject)服务来维护一段数据，例如包含设置的对象:

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

   ...

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

然后我将拥有一个组件，例如 Ionic 应用程序中的设置页面，它将从设置服务获取设置:

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

并直接将对象属性耦合到 UI 组件，如 toggle .问题不在于在每个切换更改事件上调用函数，服务或组件如何知道设置对象已更改以触发适当的操作，例如将设置保存到数据存储？

Answer 1

要构建可观察的数据服务，您可以使用 BehaviorSubject来自 rxjs。您在您的服务中创建一个主题，然后您必须在您的组件中订阅该主题。

在这里查看有关使用它创建服务的一些教程:example 1 , example 2 .

理论上，您有机会在您的服务中使用 EventEmitter。但你不应该使用它。看看这个answer更多细节。在这个答案中，您还可以找到一个示例如何使用 Observable 而不是 BehaviorSubject

来解决它