RxJs主题在服务中的合理性检查

huangapple go评论57阅读模式
英文:

Sanity Check - RxJs Subjects in a Service

问题

我正在使用一个包含多个主题的服务,我希望可以用它来存储应用程序的状态。

我还希望在其中一个主题发出时更新存储在主题中的值。

我目前的解决方案是在一种 getter/setter 函数中处理它:

export class SavedSearchService {
    private cards$ = new BehaviorSubject<Card[] | undefined>(undefined)
    private selectedList$ = new BehaviorSubject<List | undefined>(undefined)
    private extraCardProperties$ = new BehaviorSubject<ExtraProps[]>([])

    setList(list: List): Observable<void> {
        this.selectedList$.next(list)
        return this.updateCards(list)
    }

    updateCards(list: List): Observable<void> {
        this.cards$.next(undefined)
        return this.getDataFromBackend(list).pipe(tap(newCards => this.cards$.next(newCards)))
    }

    getCards(): Observable<Card[]> {
        return this.cards$.pipe(combineLatestWith(this.extraCardProperties$.pipe(first()))).pipe(map(cards, extraProps => {
            return this.updateCardsWithExtraProps(cards, extraProps)
        }))
    }

    updateCardsWithExtraProps(cards: Card[], extraProps: [...]): Card[] { ... }
}

这似乎可以工作,但... 这是一个好的做法吗?还有其他方法吗?在服务中使用订阅是否可以接受?感觉我应该避免这样做。

如果您看了一下,谢谢您的时间。 RxJs主题在服务中的合理性检查

英文:

I am working in a service with several subjects that I'd like to use to store the application state in.

I would also like to update values stored in subjects when one of the subjects emits.

My current solution to this is to deal with it in kind of getter/setter functions:

export class SavedSearchService {
    private cards$ = new BehaviorSubject&lt;Card[] | undefined&gt;(undefined)
    private selectedList$ = new BehaviorSubject&lt;List| undefined&gt;(undefined)
    private extraCardProperties$ = new BehaviorSubject&lt;ExtraProps[]&gt;([])

  setList(list: List): Observable&lt;void&gt; {
    this.selectedList$.next(list)
    return this.updateCards(list)
  }
  
  updateCards(list:List): Observable&lt;void&gt;{
    this.cards$.next(undefined)
    return this.getDataFromBackend(list).pipe(tap(newCards=&gt; this.cards$.next(newCards)))
   }


   getCards():Observable&lt;Card[]&gt;{
    return this.cards$.pipe(combineLatestWith(this.extraCardProperties$.pipe(first()))).pipe(map(cards, extraProps)=&gt;{
     return this.updateCardsWithExtraProps(cards, extraProps)
     })
   }

   updateCardsWithExtraProps(cards: Card[], extraProps: [...]): Card[]{ ... }

...
}

This seems to work but... Is this good practice? Any other way to do it? Is it ok to have subscriptions in services? Feels like I should avoid that.

Thank you for your time if you had a look at it. RxJs主题在服务中的合理性检查

答案1

得分: 1

通常,我倾向于将“服务”视为具有两个API族的类实例。

其中一个是“命令”功能集,表示它们可以接收的一组命令,例如,查询后端以获取用户的详细信息。

另一个是公开属性的可观察对象集(由于可观察对象是函数的包装器,在我看来,公开的可观察对象是一种API)。

通常,“命令”功能会执行操作,并在完成后使用一个Subject来进行“下一个”操作,该Subject是公开的可观察对象。

因此,与这种服务的更自然交互如下:

  1. 客户端注册要观察的可观察对象
  2. 任何客户端(即订阅可观察对象的客户端或通过依赖注入与相同服务共享的任何其他组件)都可以调用“命令”功能来执行某些操作。
  3. 服务执行操作,然后将公开的可观察对象“下一个”
  4. 由于订阅,订阅了公开可观察对象的客户端将得到更新。

有关此概念的详细信息,请参阅此处此处

英文:

Generally I tend to see "services" as instances of classes that have 2 families of APIs.

One is the set of "command" functions which represent the set of commands they can receive, e.g. query the back end to get the details of the user.

The other is the set of Observables exposed as public properties (since Observables are wrappers around functions, in my opinion a public Observable is an API).

Typically "command" functions do stuff and, when completed with a result, next a Subject that is the Observable exposed as API.

So, the more natural interaction with such a service is the following:

  1. A client registers to the Observables it wants to observe
  2. Any client (i.e. either the one which subscribed to the Observable or any other component that shares the same service, e.g. via dependency injection) calls a "command" function do do something.
  3. The service does the stuff and then next the Subject that is exposed as public Observable
  4. As a result of the subscription, the client which subscribed to the public Observable gets updated.

This concept is described in mode details here and here.

huangapple
  • 本文由 发表于 2023年5月10日 20:14:07
  • 转载请务必保留本文链接:https://go.coder-hub.com/76218283.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定