Table going crazy while using order pipe (same values mix)

[Guru992]

Hi!

I'm using order pipe in my app. You can find it here -> http://gurustats.usermd.net/app/#/pgee17pary. When I scroll down this page, table is going crazy. I noticed that rows with the same values mixing with each other. How can i repair this?

Component:

import { Component, OnInit } from '@angular/core';
import { Pair } from "../interfaces/pair";
import { SpeedwayService } from '../../speedway.service';
import { OrderPipe } from 'ngx-order-pipe';

@Component({
  selector: 'gs-pgee2017pary-stats',
  templateUrl: './pgee2017pary-stats.component.html',
  styleUrls: ['./pgee2017pary-stats.component.less']
})
export class Pgee2017paryStatsComponent {
pgee2017pary: Array<any>;
order: string ='PLUSMINUS';
reverse: boolean = false;
result: number[];
  constructor(private _speedwayService: SpeedwayService,
    private orderPipe: OrderPipe) 
  {
    this._speedwayService.getPgee2017pary().subscribe((response) => {
    this.pgee2017pary = orderPipe.transform(response, 'PLUSMINUS');
   }
  )
  }
   setOrder(value: string) {
    if (this.order === value) {
      this.reverse = !this.reverse;
    }
    this.order = value;
  }
}

HTML:

<tr>
                        <th [class.active]="order === 'PARA'"
                            (click)="setOrder('PARA')">
                            PARA<br>
                            <span [hidden]="reverse">▼</span>
                            <span [hidden]="!reverse">▲</span>
                        </th>
                        <th [class.active]="order === 'KLUB'"
                            (click)="setOrder('KLUB')">
                            KLUB<br>
                            <span [hidden]="reverse">▼</span>
                            <span [hidden]="!reverse">▲</span>
                        </th>
......

<tr *ngFor="let pair of pgee2017pary | orderBy: order: !reverse; let i = index">
......

[bluecaret]

Did you ever find a solution to this? I think I'm experiencing the same thing but only on a production Angular build

[Guru992]

Unfortunately not... Do you have any idea how to solve it?

[bluecaret]

@Guru992 I found another issue here that solved the issue for me. Take a look at this comment: https://github.com/VadimDez/ngx-order-pipe/issues/33#issuecomment-347366489

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.