Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular using pipes and index in ngFor

Tags:

angular

Angular had many changes in the beta, my issue is that try to use pipes and the index in a ngFor and i get this message:

Parser Error: Unexpected token = and

The pipe 'let' could not be found  

when i use this code:

 <div style="overflow-y: scroll; max-height: 200px;">
        <div (click)="showComentario(index);" *ngFor="let comment of comentarios| filterSource:selectedSource | let index=index; ">
            {{comment.comment}}
        </div>
    </div>

if i change the order like this:

<div style="overflow-y: scroll; max-height: 200px;">
    <div (click)="showComentario(index);" *ngFor="let comment of comentarios;let index=index;| filterSource:selectedSource |  ">
        {{comment.comment}}
    </div>
</div>

i get this message:

Template parse errors:
TypeError: key[0] is undefined  



Parser Error: Unexpected token |, expected identifier, keyword, or string at column 47 in [let comment of comentarios; let index=index; 

How i can use pipes and index at the same time?

EDIT: I modified the code as the comments suggested like this:

<div style="overflow-y: scroll; max-height: 200px;">
    <div (click)="showComentario(index);" *ngFor="let comment of comentarios | filterSource:selectedSource;let index=index ">
        {{comment.comment}}
    </div>
</div>

i keep getting these errors: TypeError: key[0] is undefined and Parser Error: Unexpected token |

like image 704
Progs Avatar asked May 16 '17 20:05

Progs


Video Answer


1 Answers

try below,

<div (click)="showComentario(i)" *ngFor="let comment of comentarios | filterSource : selectedSource; index as i" >
  {{comment.comment}}
</div>

Hope this helps!!

like image 88
Madhu Ranjan Avatar answered Nov 15 '22 23:11

Madhu Ranjan