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

cub*_*war 9 angular

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

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

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

   ...

   get settings()
   {
       return this._settings;
   }
}
Run Code Online (Sandbox Code Playgroud)

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

constructor(private settingsService : SettingsService)
{
    this.settings = settingsService.settings;
}
Run Code Online (Sandbox Code Playgroud)

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

mue*_*ich 9

要建立你可以使用一个可观察的数据服务BehaviorSubjectrxjs.您在服务中创建主题,然后您必须在组件中订阅此主题.

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

理论上你有机会EventEmitter在你的服务中使用.但你不应该使用它.请查看此答案以获取更多详细信息.在这个答案中,您还可以找到一个示例,如何使用Observable而不是使用它来解决它BehaviorSubject