0

I am using the solution provided in (Hide/show individual items inside ngFor)

How to set the value of pinMe[j] based on a condition ? I have situation where i need to toggle between the div's but also decide on what to show at first based on a condition. A sample code below for your info.

<ion-card *ngFor="let feed of feeds; let j=index">

  <ion-card-header> 
   <h1 (click)="pinMe[j] = !pinMe[j]">PinnedView</h1>
  </ion-card-header>
  <ion-card-content>
    <div [hidden]="!pinMe[j]"> </div>
    <div [hidden]="pinMe[j]"> </div> <!-- (pinMe[j] should change based on a key, so that the first div is shown first [the key would be feed.isPinned = '1'])
  </ion-card-content>

</ion-card>

The previous page was not allowing me to post a comment so created this as a new issue.

Thanks in advance!

user3676519
  • 13
  • 2

1 Answers1

0

I'd use ng-if to show hide div or any element.

<ion-card *ngFor="let feed of feeds; let j=index">
<ion-card-header> 
    <h1 (click)="pinMe[j] = !pinMe[j]">PinnedView</h1>
</ion-card-header>
<ion-card-content>
    <div ng-if="feed.isPinned = '1'" [hidden]="!pinMe[j]"> </div>
    <div ng-if="feed.isPinned != '1'" [hidden]=enter code here"pinMe[j]"> </div> 
</ion-card-content>
</ion-card>

ref: http://www.codelord.net/2015/07/28/angular-performance-ng-show-vs-ng-if/

Bharath T
  • 41
  • 1
  • 7
  • Sorry this did not work for me :( what i am trying to do is in the loop if the key is true then I would want to set pinMe[j] = false and for the rest it should still stay true but its hiding other div. – user3676519 Jun 16 '18 at 03:53