行为主体 RXJS

Question

我有这个链接可以更改带有时间戳的网址的结尾：

  getAvatar(channelId): BehaviorSubject<string> {
    return new BehaviorSubject(`${link}?${new Date().getTime()}`);
  }

在 Avatar 组件中，它是至少 10 个其他组件的子组件，我称之为订阅：

  getAvatar() {
    this.userService.getAvatar(this.channelId)
      .subscribe(res => {
        this.avatar = res;
        this.cdr.detectChanges();
        this.cdr.markForCheck();
      });
  }

OBS：我使用OnPushchangeDetection 策略

在另一个组件中，我有一个功能可以更改链接内的个人资料图片：

this.userService.changeProfilePicture(picture, this.myChannelId)
      .subscribe(
        () => {
          this.loading.hide();
          this.userService.getAvatar(this.id);
          this.screenService.showToastMessage('Foto de perfil alterada.', true);
        }

如您所见，我回想起 getAvatar() 函数，该函数返回一个 BehaviorSubject 以生成另一个链接，而 AvatarComponent 并没有检测到 behaviorSubject 的变化，我做错了什么？

还有另一种方法可以调用所有 AvatarComponent 实例的 getAvatar() 函数来重新加载每个头像实例？

OBS2：我尝试使用of rxjs 运算符，创建new Observable()，尝试Subject 类，所有这些似乎都没有被AvatarComponent 中的订阅检测到

OBS3：我尝试使用 @ViewChild() 获取 AvatarComponent 并调用此 this.avatarCmp.getAvatar(); 来重新加载头像，但只重新加载头像组件的一个实例

Answer 1

您的服务需要更像这样：

  private avatarSource = new BehaviorSubject(`${link}?${new Date().getTime()}`);
  avatar$ = this.avatarSource.asObservable();
  setAvatar(channelId): BehaviorSubject<string> {
    this.avatarSource.next(`${link}?${new Date().getTime()}`);
  }

那么你需要订阅 avatar$ 并使用 setAvatar 更新