Question

我有一个包含2列的列表，我希望左边显示偶数索引，右边显示奇数。

目前我正在迭代每个列的整个列表，并使用ngIf =＆＃34; odd＆＃34;进行过滤。甚至。

我可以制作ngFor，只观看偶数或奇数指数吗？

这会大大改善表现吗？当一半的DOM元素出现时，我不知道有多少负担。

列表不会经常更改，但更改后会完全更改。

Answer 1

您可以创建仅返回odd或even项

的管道

@Pipe({ name: 'evenodd' })
export class EvenOddPipe implements PipeTransform {
  transform(value:any[], filter:string) {
    if(!value || (filter !== 'even' && filter !== 'odd')) {
      return value;
    }
    return value.filter((item, idx) => filter === 'even' ? idx % 2 === 1 : idx % 2 === 0 );
  }
}

并像

一样使用它

<div *ngFor="let item of items | evenodd:'even'"></div>    
<div *ngFor="let item of items | evenodd:'odd'"></div>

角度2 ng对于偶数/奇数项目

1 个答案: