angular - Bir ngFor döngüsünün indeks değerini bileşene nasıl geçirirsiniz?

Kodumda bir ngFor döngüsü var. Ve bu ngFor döngüsünün içinde bir div var, bu div'e tıkladığımda index değerini TypeScript dosyasına geçirmek istiyorum.

Ben Angular 2'ye yeniyim, her türlü yardım takdir edilecektir.

Örn :

`<div *ngFor="let y of characters;let i = index">
    <div (click)="passIndexValue()">
    </div>
<div>`

Cevap #1

<div *ngFor="let y of characters;let i = index">
    <div (click)="passIndexValue(i)">
    </div>
<div>`


passIndexValue(index){
   console.log(index);//clicked index
}

Değeri bileşene şu şekilde de geçirebilirsiniz (aşağıdaki @Input kullanımını varsayarak)

<div *ngFor="let y of characters;let i = index">
    <childComponent [index]="i">
    </childComponent>
<div>`

Ve sonra bileşen nesnesindeki değeri al:

@Input() index: number;

Ve onu çocuk bileşenin şablonunda doğrudan şöyle kullanın:

<div id="mydivinstance_{{index}}"></div>

Böylece bir bileşenin *ngFor döngüsüne dayalı benzersiz bir kimliğe sahip olmasına izin verir.

İlgili makaleler