web-dev-qa-db-ja.com

パイプ変換後にngForで配列の長さを取得する

次のテンプレートがあります。

<div *ngFor="let item of myArray | customPipe1 | customPipe2; let l = length">
  Here is the length of my ngFor : {{l}}
</div>

残念ながら、ngForには長さがありません。この問題を回避して、ngFor内で長さを使用するにはどうすればよいですか?

10
Scipion

別の解決策は次のとおりです

<div *ngFor="let item of myArray | customPipe1 | customPipe2; let l = count">
  Here is the length of my ngFor : {{l}}
</div>

プランカーの例

こちらもご覧ください

14
yurzui
<div *ngFor="let item of myArray | customPipe1 | customPipe2 as result">
  Here is the length of my ngFor : {{result.length}}
</div>

https://angular.io/api/common/NgForOf も参照してください

13

さて、これはAngular docで十分に文書化されていません。ソースコードAngularで-

https://github.com/angular/angular/blob/master/packages/common/src/directives/ng_for_of.ts

* ngForはcountパラメーターを受け入れます。

constructor(public $implicit: T, public ngForOf: NgIterable<T>, public index: number,public count: number) {
}

したがって、次のようなカウントを取得できます-

<div *ngFor="let item of items | pipe; let l = count">
<div>{{count}}</div>
</div>
0
Kanchan