Question

在使用自定义装饰器更新某些数据时，订阅出现问题。

情况是这样的：我有自定义装饰器UserChange。此装饰器是一个方法装饰器，在一些组件中，用于在用户更改时运行组件方法。
装饰器订阅用户流，每当用户更改时，装饰器便调用该方法：

示例：

装饰器：

export function UserChange(updater: UserUpdater) {
  return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function () {
      const update = updater.userChanges().subscribe(() => {
        // @ts-ignore
        return originalMethod.apply(this, arguments);
      });
      return originalMethod.apply(this, arguments);
    };
    return descriptor;
  };
}

在某些组件中使用的示例：

@UserChange(AppModule.userUpdater)
private loadUserData() {
    this.api.getUserData.subscribe(...);
}

问题是在销毁组件时如何在装饰器中取消预订userChanges.subscription()？

通常，该订阅将在某个组件的ngOnDestroy中取消订阅，但是在这个地方，我对装饰器订阅没有影响。同样的情况则相反。我没有引用组件subscription来对此进行调用add(update)。因为target是类的原型，而不是实际的组件类实例。

如何解决这个问题？如何取消订阅装饰器订阅？

Answer 1

好吧，我终于找到了解决方法：

export function UserChange(updater: UserUpdater) {
  return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function () {
      const update = updater.userChanges().subscribe(() => {
        // @ts-ignore
        return originalMethod.apply(this, arguments);
      });

      target['ngOnDestroy'] = () => update.unsubscribe();

      return originalMethod.apply(this, arguments);
    };
    return descriptor;
  };
}

Angular 2自定义装饰器取消订阅策略

1 个答案: