Question

我基本上试图计算ngFor指令概述的列表数量。我已经采用了很多解决方案来解决我的问题，但这并不成功。下面是我的代码，我得到错误，未定义父。

管

@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {


    parent : string;
    transform(value) : any {
        let keys = [];



        if(value) {

            this.parent = value;

            return Object.keys(value)
 }
    }
}

HTML

<div *ngFor="let game of games">

  <div *ngFor="let key of game| keys">

  <li> {{game[key].type}} </li>

  {{ game[key].location}}

    Count: {{game.parent.length}}

</div>


</div>

输出

 mario - germany
 kart - london
 rings - france 

total number of items  = 3

Answer 1

您可以使用index ngFor代替自定义管道

<div *ngFor="let game of games">

  <div *ngFor="let key of game| i=index ">

  <li> {{game[i].type}} </li>

  {{ game[i].location}}

    Count: {{game.parent.length}}

</div>

Answer 2

你的计数应该在div之外，

<div *ngFor="let game of games">
  <div *ngFor="let key of game| i=index ">
  <li> {{game[i].type}} </li>
  {{ game[i].location}}   
</div>
<div>
 total number of items: {{game.parent.length}}
</div>

使用带有管道的角度2来计算项目

2 个答案: