Hide information from an ionic / angular collapse

0

I have a collapse that works fine, however I need to hide / show the trigger according to the index of that product.

What I currently have:
Html:

<p data-toggle="collapse" attr.data-target="#{{pergunta.id_pergunta}}" (click)="hideInformacoes()" [hidden]="tocouInfo" class="maisInformacoes">Ver mais informações</p>

<div id="{{pergunta.id_pergunta}}" class="alinha collapse">
    Informações do produto
</div>

Ts:

  hideInformacoes(){
    if(this.tocouInfo == false){
      this.tocouInfo = true;
    }
    else if(this.tocouInfo == true){
      this.tocouInfo = false;
    }
  }

But as I'm iterating over an ngfor, as soon as I click on See More Info it disappears as expected, however it also hides that of other products that have not yet been clicked, I need to figure out a way to pass the index of that clicked product and just hide it. Has anyone done anything like this?

    
asked by anonymous 02.08.2018 / 15:12

1 answer

2

After a search I easily got through the following code:

(click)="hideinfo[i] = !hideinfo[i]" [hidden]="hideinfo[i]"

I declare an array hideinfo in my ts:

hideinfo[];

I took my ng index for adding:

let i = index;
    
02.08.2018 / 15:18