One click opens the next

Ionic Framework
1

Hello
I want to make an app or when we press a text or button it displays the following text / button ect …
what is the best element to use?
button, card, text or other ??

Thank you in advance.

2

to explain it better I give an example.
on my page I have the text A and B, if I click on A I have C which opens, if I click on B I have D which opens.

Thank you in advance.

3

I admit to being confused by what you mean by “open” here. Is this more or less what you’re after?

  redFruits = ["apple", "cherry"];
  activeRed = 0;
  yellowFruits = ["banana", "lemon"];
  activeYellow = 0;

  advanceRed(): void {
    this.activeRed = Math.max(this.activeRed + 1, this.redFruits.length - 1);
  }

  advanceYellow(): void {
    this.activeYellow = Math.max(this.activeYellow + 1, this.yellowFruits.length - 1);
  }

   <ion-button (click)="advanceRed()">{{redFruits[activeRed]}}</ion-button>
   <ion-button (click)="advanceYellow()">{{yellowFruits[activeYellow]}}</ion-button>
4

good evening thank you for the reply.
I found a start to what I would like.

Capture
Capture625×644 19.9 KB

when i click on a button i have my list displayed.
Now I’m trying to hide the 2nd button when I click on the 1st

Thank you

5

Well, that can be done by either using ngIf or binding [hidden].

6

Hello,
Thanks for the idea.
Here is what i did <ion-button (click)="hide = !hide" [hidden]="hide2">Produit Stacké</ion-button>
I click on the button 1- my div is displayed and button 2 disappears, I click on it again, the div disappears and button 2 returns.
:slightly_smiling_face: :slightly_smiling_face:

7

on a page I have 3 buttons, A B and C.
how to hide B and C if I click on A?