如何在Angular中使用effect()识别触发变更的目标Signal？

有几种实用方案可以区分具体是哪个Signal触发了effect：

1. 拆分独立effect #

最直接的方式是给每个Signal单独绑定effect，每个effect只响应对应Signal的变更，逻辑清晰无歧义：

@Injectable({ providedIn: 'root' })
export class ExternalController {
  public controller1 = signal<null | any>(null);
  public controller2 = signal<null | any>(null);

  constructor() {
    // 仅响应controller1的变更
    effect(() => {
      const value = this.controller1();
      if (value) {
        // 执行controller1对应的业务逻辑
      }
    });

    // 仅响应controller2的变更
    effect(() => {
      const value = this.controller2();
      if (value) {
        // 执行controller2对应的业务逻辑
      }
    });
  }
}

2. 对比前后值判断变更 #

如果必须在同一个effect内处理，可以通过保存前一次的值，和当前值对比来定位变更的Signal：

@Injectable({ providedIn: 'root' })
export class ExternalController {
  public controller1 = signal<null | any>(null);
  public controller2 = signal<null | any>(null);
  private prevCtrl1: null | any = null;
  private prevCtrl2: null | any = null;

  constructor() {
    effect(() => {
      const currentCtrl1 = this.controller1();
      const currentCtrl2 = this.controller2();

      if (currentCtrl1 !== this.prevCtrl1) {
        // controller1发生变更，执行对应逻辑
        this.prevCtrl1 = currentCtrl1;
      }

      if (currentCtrl2 !== this.prevCtrl2) {
        // controller2发生变更，执行对应逻辑
        this.prevCtrl2 = currentCtrl2;
      }
    });
  }
}

3. 用computed辅助追踪变更 #

如果需要更灵活的状态判断，可以借助computed生成变更标识，结合peek()方法（获取值但不订阅）来精准识别：

@Injectable({ providedIn: 'root' })
export class ExternalController {
  public controller1 = signal<null | any>(null);
  public controller2 = signal<null | any>(null);

  private changeMarker = computed(() => ({
    isCtrl1Changed: this.controller1() !== this.controller1.peek(),
    isCtrl2Changed: this.controller2() !== this.controller2.peek()
  }));

  constructor() {
    effect(() => {
      const changes = this.changeMarker();
      if (changes.isCtrl1Changed) {
        // 处理controller1变更逻辑
      }
      if (changes.isCtrl2Changed) {
        // 处理controller2变更逻辑
      }
    });
  }
}

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