如何订阅rxjs中另一个对象中引用的对象的属性更改答案

【问题标题】：How to subscribe to the property change of an object referenced within another object in rxjs如何订阅rxjs中另一个对象中引用的对象的属性更改
【发布时间】：2019-01-23 01:37:57
【问题描述】：

我对 Angular 和 RxJS 都很陌生。我正在尝试创建一个允许不同对象共享树结构数据集的 Angular 组件。

这是我想象中的简化方案 - 一个 Angular 组件，用于将整个公司结构发布到服务器。这个结构是多个“StuffDto”对象的组合，它们相互引用作为它们的管理器。并且所有的东西都共享同一个公司部门结构图。

多级结构图如下：

营销部
- 销售部
  - 店内销售团队
  - 现场销售团队
- 广告部
  - 策划团队
  - 设计师团队
制造部
- 研发部
  - 工程师团队
  - 研究团队
- 质量保证部
  - 督察组
  - 保证团队

这是我的StaffDto 课程，将在提交后直接发布到服务器。

export class StaffDto {
    id: string;
    name: string;
    assignedDept?: string;
    managerId?: string;
}

这是我的 Stuff 对象，它将在我的 Angular 应用程序中传递。

export class Stuff {
    data: StuffDto;
    _manager: Stuff;

    get manager(): Stuff {
        return this._manager;
    }

    set manager(manager: Stuff) {
        this._manager = manager;
        this.data.managerId = manager.data.id;
    }
}

这适用于一些简单的场景，但不是全部。

如果我创建了 Peter 和 Tom，则将 Peter 设置为 Tom 的经理。这是 2 个StuffDto 对象的样子。

{ id: abc01,
  name: 'Peter',
  assignedDept: 'Marketing Dept',
  managerId: null }
{ id: abc02,
  name: 'Tom',
  assignedDept: 'Sales Dept',
  managerId: 'abc01' }

如果我将 Peter 的 id 从“abc01”更改为“abc01a”，我希望 tom 的 ManagerId 也会更改。另外，如果我将 Peter 的 assignedDept 表单“营销部”更改为“研发部”，因为 Peter 的部门下面不会有“销售部”来分配 Tom，所以应该将 Tom 的 assignedDept 清除为空。

我不太确定这是否可以通过订阅 RxJS 来完成。我尝试将_manager 设为Subject，然后订阅它。但是该函数只会在分配新经理时调用，而不是在经理的属性更改时调用。

我想知道是否有一种方法可以在不更改太多代码的情况下做到这一点。由于StuffDto 将被传递到服务器，因此我无法更改它。

【问题讨论】：

这更像是其他rxjs的记录集迭代和更新问题。你不需要为此使用 rxjs。
@FanCheung 你能说得更具体点吗？
你可以把迭代和更新逻辑放在你的setter中来更新staff列表，rxjs主要是处理异步操作。如果您刚开始使用 RXJS，我不建议您使用它进行数组处理。
看看像 NGRX 或 NGXS 这样的状态管理库 - 它们是管理复杂的应用程序范围内共享状态的正确方法，所有这些逻辑都将拥有一个整洁干净的地方。您当然/可以/自己从普通的 observables 中破解一些东西来解决这个问题，但考虑到您所说的各种变化，这将是复杂的、非常具体的，并且很难干净地测试。

标签： angular typescript rxjs angular6 rxjs6

【解决方案1】：

如果我正确理解了这个问题，this@cartant 的文章可能就是您要查找的内容。

我们的想法是以每个属性都有自己的 observable 的方式包装您的对象，并使用代理对象进行分配。

我希望这符合您的需求。

【讨论】：