Как ссылаться на sh отдельную ячейку / строку без повторного рендеринга всей таблицы с использованием ngx-datatable? - PullRequest
Новая
       27

Как ссылаться на sh отдельную ячейку / строку без повторного рендеринга всей таблицы с использованием ngx-datatable?

0 голосов
/ 26 февраля 2020

Я пытаюсь обновить строку / ячейку ngx-datatable, поскольку она исходит из сокета. Но когда данные поступают из сокета, вся таблица обновляется. Я не хочу обновлять sh всю таблицу, так как я вызываю сложную функцию через каждую ячейку. Я использую angular 8 

        <ngx-datatable [rows]="dataRows"  [sorts]="sortList" [externalSorting]=false rowHeight="auto" >

            <ngx-datatable-column *ngFor="let column of columnList;let i = index"  name="{{column.label}}" prop="{{column.key}}" [comparator]="sortComparator" >
                <ng-template let-row="row" let-rowIndex = "rowIndex" ngx-datatable-cell-template>
                    <div [matTooltip]="column.type==='tempIcon' ? (returnTooltip(dataRows[i].temp_icon)) : null">
                        <div [cdkPortalOutlet]="selectTemplate(row,column,tempData[rowIndex],columnList[i],i)" ></div>
                    </div>
                </ng-template>
            </ngx-datatable-column>
    </ngx-datatable>

Здесь я пытаюсь динамически получить столбец из списка. Но для сеанса столбцы не изменятся. Проблема в функции selectTemplate. Я использую сокет для обновления строки в dataRows. когда я обновляю его, таблица перерисовывается и вызывает функцию selectTemplate более 760 раз. которая действительно потребляет энергию. Это также замедляет работу всей страницы, поскольку каждые несколько секунд появляются новые данные.

Так я получаю данные из сокета. LastData передается во внутренний компонент каждый раз, когда происходит изменение. Исходные данные также передаются через lastData. 

this.dataSource = Observable.create((observer)=>{
          this.socket.on('message',data=>{
              observer.next(data);
          });
      });
      this.dataSource.subscribe(data=>{
          this.lastData = [data];
          this.combineData();
          console.log('new data',this.lastData);
      });
...