如何获取* ngFor循环唯一记录 [英] How go get *ngFor loop unique records

问题描述

如何从此数组中获取唯一记录。我需要从这个项目数组中获得唯一的 {{subitem.author}} 。

How to get unique records from this array. I need to get unique {{ subitem.author }} from this array of items.

<div *ngFor="let item of items">   
    <ion-list *ngFor="let subitem of item.items" (click)="authorquotes(subitem.author);">
        <ion-item >
            {{ subitem.author }} 
        </ion-item>
    </ion-list>
</div> 

在包含多条记录的数组中。从该数组中，我需要过滤唯一的作者。

In array having multiple records. From that array, I need to filter unique authors.

推荐答案

您必须创建一个用唯一项过滤数组的管道：

You have to create a pipe that filters the array with unique items:

@Pipe({
  name: 'filterUnique',
  pure: false
})
export class FilterPipe implements PipeTransform {

  transform(value: any, args?: any): any {

    // Remove the duplicate elements
    let uniqueArray = value.filter(function (el, index, array) { 
      return array.indexOf (el) == index;
    });

    return uniqueArray;
  }
}

然后你可以申请你的管道：

Then you can apply your pipe:

<div *ngFor="let item of items | filterUnique">   
    <ion-list *ngFor="let subitem of item.items" (click)="authorquotes(subitem.author);">
        <ion-item >
            {{ subitem.author }} 
        </ion-item>
    </ion-list>
</div>

工作演示： https://plnkr.co/edit/yxvoKVD3Nvgz0T3AB7w3?p=preview

这篇关于如何获取* ngFor循环唯一记录的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！