什么触发了combineLatest？

Question

我有一些观察结果。我需要知道哪一个触发了订阅。

Observable.combineLatest(
      this.tournamentsService.getUpcoming(),
      this.favoriteService.getFavoriteTournaments(),
      this.teamsService.getTeamRanking(),
(tournament, favorite, team) => {
//what triggered combinelatest to run?
}).subscribe()

Answer 1

实现此目的的一种非常干净且“rx”的方法是使用时间戳运算符http://reactivex.io/documentation/operators/timestamp.html

示例代码

sourceObservable
  .pipe(
    timestamp(),  // wraps the source items in object with timestamp of emit
    combineLatest( otherObservable.pipe( timestamp() ), function( source, other ) {

      if( source.timestamp > other.timestamp ) {

        // source emitted and triggered combineLatest
        return source.value;
      }
      else {

        // other emitted and triggered combineLatest
        return other.value;
      }

    } ),
  )

如果

combineLatest()

涉及两个以上的可观察量，则按时间戳对它们进行排序将能够检测哪一个触发了

combineLatest()

。

Answer 2

简短的回答是：你不知道。 您可以实现一些解决方法，但这确实很难看，我建议重新考虑用例为什么需要这个，也许您是否可以更改架构。 另请记住，函数的第一次执行将在所有三个可观察量发出至少 1 个值之后进行。

无论如何 - 可能的解决方法可能是：

let trigger = "";
Observable.combineLatest(
      this.tournamentsService.getUpcoming().do(() => trigger = "tournament"),
      this.favoriteService.getFavoriteTournaments().do(() => trigger = "favTournament"),
      this.teamsService.getTeamRanking().do(() => trigger = "teamRanking"),
(tournament, favorite, team) => {
   console.log(`triggered by ${trigger}`);
}).subscribe();

如果您想根据触发的可观察量执行特定操作，您应该使用每个可观察量并将它们用作单独的触发器，切换到组合触发器，它可能会稍微多一些代码，但它更干净，您会不会最终陷入丑陋的 if/else、switch/case 混乱以及一些老套的解决方法 - plus 您甚至将有机会使用

async

管道，而不是手动订阅所有内容并更新局部变量（无论如何，这是一个不好的做法）：

以下是一些示例代码，展示了它的样子：

let upcoming$ = this.tournamentsService.getUpcoming();
let favorite$ = this.favoriteService.getFavoriteTournaments();
let rankings$ = this.teamsService.getTeamRanking();

let allData$ = Observable.combineLatest(
    upcoming$, favorite$, rankings$,
    (tournament, favorite, team) => {
        return {tournament, favorite, team};
    }
);

// initial call -> this SHOULD be redundant,
// but since I don't know your code in detail
// i've put this in - if you can remove it or not
// depends on the order your data coming in
allData$
    .take(1)
    .do(({tournament, favorite, team}) => {
        this.displayMatches(...);
        this.sortByFavorites(...);
        this.fillWithRanking(...);
    })
    .subscribe();

// individual update triggers
upcoming$
    .switchMapTo(allData$.take(1))
    .do(({tournament, favorite, team}) => this.displayMatches(...))
    .subscribe();

favorite$
    .switchMapTo(allData$.take(1))
    .do(({tournament, favorite, team}) => this.sortByFavorites(...))
    .subscribe();

rankings$
    .switchMapTo(allData$.take(1))
    .do(({tournament, favorite, team}) => this.fillWithRanking(...))
    .subscribe();

Answer 3

我得出了以下解决方案，有点类似于卡特兰提出的方案，但使用成对而不是扫描，这看起来更优雅。成对运算符将先前发出的值保留在缓冲区中，并将先前的值和新发出的值作为数组提供给下一个运算符，因此您可以轻松检查值是否已更改并进一步传递结果。 在我的示例中，为了清晰起见，我将其简化为仅 2 个可观察对象。

combineLatest([obs1$, obs2$]).pipe(
    pairwise(),
    map(([oldValues, newValues]) => oldValues.map((value, i) => value !== newValues[i])),
    ).subscribe(([obs1$HasChanged, obs2$HasChanged]) => {
)

Answer 4

您可以使用

scan

运算符将发出的值与任何先前发出的值进行比较，并且可以包含指示组合可观察量的组成部分是否实际发生变化的附加数据。例如：

let combined = Observable
  .combineLatest(
    this.tournamentsService.getUpcoming(),
    this.favoriteService.getFavoriteTournaments(),
    this.teamsService.getTeamRanking()
  )
  .scan((acc, values) => [
    ...values,
    acc[0] !== values[0],
    acc[1] !== values[1],
    acc[2] !== values[2]
  ], []);

combined.subscribe(
  ([tournament, favorite, team, tournamentChanged, favoriteChanged, teamChanged]) => {
    console.log(`tournament = ${tournament}; changed = ${tournamentChanged}`);
    console.log(`favorite = ${favorite}; changed = ${favoriteChanged}`);
    console.log(`team = ${team}; changed = ${teamChanged}`);
  }
);

Answer 5

combineLatest([
    this.obs1.pipe(tap(() => (this.trigger = 'obs1'))),
    this.obs2.pipe(tap(() => (this.trigger = 'obs2'))),
])
.subscribe(([obs1, obs2]) => {
    switch (this.trigger) {
        case 'obs1':
            // ...
        case 'obs2':
            // ...
    }
})

Answer 6

解决此问题的更好方法是使用可区分的联合类型。如果您的语言没有内置可区分的联合，您可以通过将构造函数设为私有并公开

n

可为空的公共静态属性（每个可观察值一个）来创建一个联合。用 C# 编写此内容，因为我更熟悉该语言，但它应该很容易翻译。注意可为空的字符串。如果您的语言不支持可空值，请使用其他机制来指示是否设置了值。

private class DiscriminatedUnion
{
    private DiscriminatedUnion(string? property1, string? property2)
    {
        Property1 = property1;
        Property2 = property2;
    }

    public string? Property1 { get; }
    public string? Property2 { get; }

    public static DiscrimintatedUnion FromObservable1(string property1)
    {
        return new DiscriminatedUnion(property1, null);
    }

    public static DiscrimintatedUnion FromObservable2(string property2)
    {
        return new DiscriminatedUnion(null, property2);
    }

}

private IObservable<DiscriminatedUnion> CreateCombination()
{
    var firstObservable = tournamentsService
        .getUpcoming()
        .Select(x => DiscriminatedUnion.FromObservable1(x));

    var secondObservable = favoriteService
        .getFavoriteTournaments()
        .Select(x => DiscriminatedUnion.FromObservable2(x));

    return Observable
        CombineLatest(firstObservable, secondObservable);
}

所以现在你可以质疑从

CreateCombination()

返回的有区别的联合，哪个 observable 发出了一个值。