如何单独更新BehaviorSubject中的单个属性？

你现在的核心问题是：你的BehaviorSubject存储的是完整的address对象，但当前的updateAddress方法只能接收完整对象，没法单独更新单个属性。要实现单独更新，你需要基于当前对象创建一个新的对象（遵循RxJS的不可变数据原则），只修改需要更新的属性，再传递给BehaviorSubject。

第一步：修改SharedObject中的更新逻辑 #

先在你的SharedObject服务里，把updateAddress改成支持部分属性更新的版本：

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class SharedObject {
  myAddress: any = { "plot":32, "street":"D15 Road" };
  private address = new BehaviorSubject(this.myAddress);
  addressClass = this.address.asObservable();

  // 支持传入部分属性，合并到现有对象
  updateAddress(partialAddress: Partial<any>) {
    // 获取当前存储的地址对象
    const currentAddress = this.address.value;
    // 创建新对象：保留原有属性，覆盖传入的新属性
    const newAddress = { ...currentAddress, ...partialAddress };
    // 把新对象发送给订阅者
    this.address.next(newAddress);
  }
}

这里用ES6扩展运算符...创建新对象，既不会修改原对象，又能确保每次更新都是全新的引用——这很重要，因为RxJS的Subject会通过引用判断数据是否变化，如果直接修改原对象再传递，订阅者可能不会触发更新。

第二步：在组件中调用更新方法 #

然后回到HelloComponent，修改updatePlot方法，传入包含plot属性的对象即可：

import { Component, Input, OnInit } from '@angular/core';
import { SharedObject } from './shared.object';

@Component({
 selector: 'hello',
 template: `
 <h1>Hello {{name}}!</h1>
 <h2>City Name in Hero : {{heroName}}</h2>
 <h3>{{plotNo}}</h3>
 <button (click)="updatePlot(44)">Update Plot </button>
 `,
 styles: [`h1 { font-family: Lato; }`]
})
export class HelloComponent {
 @Input() name: string;
 plotNo: number;
 address: any;

 constructor(private shared: SharedObject){ }

 ngOnInit(){
   this.shared.addressClass.subscribe((address) => {
     this.plotNo = address.plot;
   })
 }

 updatePlot(newNo){
   // 传入仅包含plot属性的对象，实现单独更新
   this.shared.updateAddress({ plot: newNo });
 }
}

这样点击按钮后，就能单独更新plot属性，同时保留street的原有值，订阅者也能正确接收到变化并更新视图。

内容的提问来源于stack exchange，提问作者3gwebtrain