CODEWITHSUNDEEP
angulartypescriptionic2ionic3
Fresco
Fresco

Reputation: 363

How to call another variable inside ngFor loop

Need your help:

//ts file
export class SettingsPage {
  pays: [string] = [];
  gateways: string = '';

I can successfully call both individually but when i call gateways inside pays loop it doesn't work: 

<ion-row>

  <ion-item *ngFor="let pay of pays">
  <ion-icon name="image" item-start></ion-icon>
  <ion-input type="text" [(ngModel)]="pay['payto']" placeholder="{{pay.name}}">
  {{gateways.desc}}   // doesn't work inside the loop
  </ion-input>

{{gateways.desc}} // works fine outside the loop

</ion-row>

Upvotes: 1

Views: 533

Answers (2)

sebaferreras
sebaferreras

Reputation: 44659

It's not being shown because it's not valid to add anything inside of the ion-input (check the docs).

You can definitely add that inside of the loop, like this:

<ion-row>
  <ion-item *ngFor="let pay of pays">
    <ion-icon name="image" item-start></ion-icon>
    <ion-input type="text" [(ngModel)]="pay['payto']" placeholder="{{pay.name}}"></ion-input>
    <ion-note item-end>{{ gateways.desc }}</ion-note>
  </ion-item>
</ion-row>

I'm using an ion-note just to add another valid Ionic layout, but you could add whatever you want if it's valid in Ionic.

Upvotes: 2

Saurabh Agrawal
Saurabh Agrawal

Reputation: 7739

seems like you have not closed <ion-item *ngFor="let pay of pays"> tag

Try this hope it will work

<ion-row>
    <ion-item *ngFor="let pay of pays">
          <ion-icon name="image" item-start></ion-icon>
          <ion-input type="text" [(ngModel)]="pay['payto']" placeholder="{{pay.name}}">
          {{gateways.desc}}   // doesn't work inside the loop
          </ion-input>
    </ion-item> <!-- close this  tag -->
    {{gateways.desc}} // works fine outside the loop

</ion-row>

Upvotes: 1

Related Questions