Javascript 如何确定在observable.merge中更改了哪些observable？

在下面，您可以看到我为可读性和清晰性而简化的代码：

connect(): Observable<Customer[]> {
   const displayDataChanges = [
     this._customerDatabase.dataChange,
     this._filterChange,
     this._sort.mdSortChange,
     this._paginator.page
   ];
   return Observable.merge(...displayDataChanges).map(() => {
     let data = this._customerDatabase.data.slice();
     data = this.getFilteredData(data);
     data = this.getSortedData(data);
     const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
     return data.splice(startIndex, this._paginator.pageSize);
   });
}

每次其中一个发出数据时，我都希望我的客户群发生变化。（当我加载数据时、当我的过滤器已更改时、当我选择另一种排序机制时以及当我更改页面时）

然后，我将所有这些合并在一起，以便“组装”必须返回的数据。正如您所见，它的性能不是很好，因为它无法区分实际可观察到的发射数据

我如何做到这一点并确定哪些可观察到的已被改变？ （下面是伪代码）

---

您可以使用

combinelatetest

而不是

merge

。这样，您就可以为每个合并的观察对象获取一个发出的值。您只需保留

mdSortChange

和

\u filterChange

的最后一个值的引用，以检查它们是否已更改

connect（）：可观察{
const displayDataChanges=[
这是.\u customerDatabase.dataChange，
这个.\u过滤器更换，
此.\u sort.mdSortChange，
这是._paginator.page
];
设lastFilter=null；
设lastSort=null；
可观测回波
.CombineTest（…显示数据更改）
.map（（[newData，newFilter，newSort，newPage]）=>{
让data=this.\u customerDatabase.data.slice（）；
if（newFilter！==lastFilter）{
data=this.getFilteredata（数据）；
lastFilter=newFilter；
}
if（newSort！==lastSort）{
数据=此.getSortedData（数据）；
lastSort=newSort；
}
const startIndex=this.\u paginator.pageIndex*this.\u paginator.pageSize；
返回数据拼接（startIndex，this.\u paginator.pageSize）；
});
}

实现这一点的一种方法是让您的可观测对象发射一个具有类型的对象。例如：

connect(): Observable<Customer[]> {

   const typifier = (type) => {
       return (val) => {
           return { type: type, value: val };
       }
   };

   const displayDataChanges = [
       this._customerDatabase.dataChange,
       this._filterChange.pipe(map(typifier('filterChange'))),
       this._sort.mdSortChange.pipe(map(typifier('sortChange'))),
       this._paginator.page
   ];

   return merge(...displayDataChanges).pipe(map(obj => {

       let data = this._customerDatabase.data.slice();

       if (obj.type === 'filterChange')
       {
           data = this.getFilteredData(data);
       }

       if (obj.type === 'sortChange')
       {
           data = this.getSortedData(data);
       }

       const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
       return data.splice(startIndex, this._paginator.pageSize);
   }));
}

connect（）：可观察{
常量打字员=（类型）=>{
返回值（val）=>{
返回{type:type，value:val}；
}
};
const displayDataChanges=[
这是.\u customerDatabase.dataChange，
此.u filterChange.pipe（映射（打字机（'filterChange'）），
this.\u sort.mdSortChange.pipe（映射（打字机（'sortChange'）），
这是._paginator.page
];
返回合并（…displayDataChanges）.pipe（映射（obj=>{
让data=this.\u customerDatabase.data.slice（）；
如果（obj.type=='filterChange'）
{
data=this.getFilteredata（数据）；
}
if（obj.type==='sortChange'）
{
数据=此.getSortedData（数据）；
}
const startIndex=this.\u paginator.pageIndex*this.\u paginator.pageSize；
返回数据拼接（startIndex，this.\u paginator.pageSize）；
}));
}

---

这里是一个链接，您可以使用它来使用点击和间隔观察

嗨，纪尧姆，谢谢你的回答！我已经尝试过了，但它似乎没有在可观察对象中执行代码？使用merge，它确实执行了，但这也是我的问题；）每个

displayDataChanges

应至少发出一个值。您能否更改页面、筛选和排序以查看这是否有效？

combinelateest

仅在可观察对象完成时发出-

merge

在任何合并可观察对象的每个

next

上发出

combinelateest

仅在所有组合可观察对象发出至少一个值时发出。产生的可观测发射一个数组，其中包含每个组合可观测的最后发射值<代码>合并在合并的可观察对象发出时发出。生成的可观察对象发出单个值（不是数组）。

return Observable.merge(...displayDataChanges).map(() => {

 **[ALWAYS]**
 let data = this._customerDatabase.data.slice();

 **[IF MY SORTING HAS CHANGED]**
 data = this.getSortedData(data); /* After which i will change the dataSet */
 **[IF MY FILTER HAS CHANGED]**
 data = this.getFilteredData(data);

 **[ALWAYS]**
 const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
 return data.splice(startIndex, this._paginator.pageSize);
});

connect(): Observable<Customer[]> {
  const displayDataChanges = [
    this._customerDatabase.dataChange,
    this._filterChange,
    this._sort.mdSortChange,
    this._paginator.page
  ];

  let lastFilter = null;
  let lastSort= null;

  return Observable
    .combineLatest(...displayDataChanges)
    .map(([newData, newFilter, newSort, newPage]) => {
      let data = this._customerDatabase.data.slice();

      if (newFilter !== lastFilter) {
        data = this.getFilteredData(data);
        lastFilter = newFilter ;
      }

      if (newSort !== lastSort) {
        data = this.getSortedData(data);
        lastSort = newSort;
      }

      const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
      return data.splice(startIndex, this._paginator.pageSize);
 });
}

connect(): Observable<Customer[]> {

   const typifier = (type) => {
       return (val) => {
           return { type: type, value: val };
       }
   };

   const displayDataChanges = [
       this._customerDatabase.dataChange,
       this._filterChange.pipe(map(typifier('filterChange'))),
       this._sort.mdSortChange.pipe(map(typifier('sortChange'))),
       this._paginator.page
   ];

   return merge(...displayDataChanges).pipe(map(obj => {

       let data = this._customerDatabase.data.slice();

       if (obj.type === 'filterChange')
       {
           data = this.getFilteredData(data);
       }

       if (obj.type === 'sortChange')
       {
           data = this.getSortedData(data);
       }

       const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
       return data.splice(startIndex, this._paginator.pageSize);
   }));
}