возвращать результаты, только если они разные, rxjs Angular - PullRequest
Новая
       10

возвращать результаты, только если они разные, rxjs Angular

0 голосов
/ 30 апреля 2018

Я создаю компонент с сеткой данных материала

Внутри каждой строки я динамически создаю компонент и добавляю его в последнюю ячейку, он устанавливается как многоточие (кнопка просмотра дополнительной информации)

У меня есть функция, которая добавляет их в ячейку таблицы и добавляет к ним информацию из данных, возвращаемых из вызова API 

  addEllipsisToTable() {
    setTimeout(() => {
      let sideMenu = this.sideMenu.toArray()
      // Add ellipsis menus' to returned results
      for (let i = 0; i < sideMenu.length; i++) {
        const factory = this.resolver.resolveComponentFactory(this.ellipsis);
        let container = this.sideMenu.toArray()[i]
        const ellipsisComponent = container.createComponent(factory);
        ellipsisComponent.instance.data = this.returnedData[i]
      }
    }, 300)

  }

Это работает, однако, когда я фильтрую записи, используя поле поиска, несколько раз многоточие добавляется дважды.

Это код для поиска: 

let txt: Filter;
    fromEvent(this.input.nativeElement, 'keyup')
      .pipe(
        debounceTime(200),
        distinctUntilChanged(),
        tap(() => {
          this.filtersArray = [];
          txt = {
            Value: this.input.nativeElement.value,
            Operation: 5,
            Property: 'Name'
          }
          this.filtersArray.push(txt);
        })
      )
      .subscribe((data) => {
        this.paginator.pageIndex = 0;
        this.loadUserPage();//reloads datagrid
      });

Когда вы печатаете и данные возвращаются, выполняется функция getPagedInfo, которая удаляет многоточие, получает данные, а затем добавляет новые обратно: 

getPagedInfo() {
    return this.dataSource.pagedInfoSubject
      // .skip(1)
      .pipe(
        tap(() => this.removeEllipsisFromTable())
      )
      .subscribe((data) => {
        this.selection.clear();
        this.totalItems = data.totalItems;
        this.returnedData = data.returnedData;
        this.addEllipsisToTable()//This sometimes gets performed twice
        console.log(this.returnedData)
        //returnedData holds array of current visible items
        if (this.totalItems == 0) {
          this.filtersArray = [];
        } else if (this.totalItems < 10) {
          this.filtersArray = [];
        }
      });
  }

Есть ли функция rxjs, которую я могу использовать, может быть, или мне придется сопоставлять новые возвращенные данные со старыми и, если они другие, добавить?

...