How to pass index of an array from one component to another in angular2?

Question

Currently I am using angular and I have an array in typescript file like this.

var channelArray = {"channel1", "channel2", "channel3"}

In my html I have code like

<div *ngFor="let val of channelArray">
            <de-series-prop></de-series-prop>
            </div>

How do I pass the index of the array to series-prop component. I need the index value to assign some values in series-prop component.

Adnan A. · Accepted Answer · 2017-03-21 22:23:43Z

1

<div *ngFor="let val of channelArray; let i = index">
  <de-series-prop [index]="i"></de-series-prop>
</div>

In your component:

@Input()
index: Number;

answered Mar 21, 2017 at 22:23

Adnan A.

1,9821 gold badge14 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

toskv · Accepted Answer · 2017-03-21 22:18:40Z

0

*ngFor exposes the index as a local variable.

<li *ngFor="let item of items; let i = index; trackBy: trackByFn">...</li>

You can see the documentation here.

answered Mar 21, 2017 at 22:18

toskv

31.8k7 gold badges77 silver badges77 bronze badges

Thanks for this info.