Angular 6 - 在过滤 returns 错误值后单击 table 行

Question

这是一个一般性问题 - 我有一个 table 包含可点击的行。单击后，用户将被带到另一个页面并显示更多数据。当然，这个数据取决于点击的是哪一行。在对 table 执行过滤操作之前，此功能可以正常工作。筛选完成后，单击同一行不会 return 正确的数据。问题是，过滤后索引是否会发生变化，从而影响下一页显示的数据？如果需要，我可以 post 一些片段，但我认为这可能取决于索引。

<div class="cell small-2">
          <div class="row">
            <h6 class="text-justify"
                style="margin-bottom: 0; margin-left: 8px;text-transform: uppercase; font-weight: 500;">
              Venue
            </h6>
            <input type="text" [(ngModel)]="sessionFilter.session_location_venue" placeholder="Filter"
                   style="margin-top: 7px; margin-left: 1px; text-transform: uppercase" maxlength="34">

          </div>
        </div>

这是过滤器之一。

<app-session-item
      *ngFor="let sessionEl of sessions | filterBy: sessionFilter; let i = index"
      [session]="sessionEl" [index]="sessions.length - i - 1">
    </app-session-item>

过滤函数：

sessionFilter: any = {
session_location_venue: ''

};

Answer 1

是的，你是对的，你的行可以根据过滤器值有不同的索引。例如，您有以下行：

[
     {value: 'a', id: 1}, // index: 0
     {value: 'b', id: 2}, // index: 1
     {value: 'c', id: 3}, // index: 2
     {value: 'd', id: 4}, // index: 3
     {value: 'e', id: 5}  // index: 4
]

然后，您应用了一个过滤器，它只获取带有 value: 'e' 的行。现在你有另一个索引：

[
     {value: 'e', id: 5}  // index: 0
]

所以你不应该依赖索引。您应该依赖可靠的东西，例如id.

Angular 6 - 在过滤 returns 错误值后单击 table 行

Angular 6 - Clicking on a table row after filtering returns wrong values

angular

angular6