CODEWITHSUNDEEP
javascriptangularionic-framework
Eraldo Guri
Eraldo Guri

Reputation: 61

Ionic create two buttons inside a button

Hello I'm looking for a way in Ionic to make a button,that when I click on it it will show two other buttons.That's what I need to do: when I click on button Allega verbale,this button will open Camera and Gallery for selecting an image.Once image is selected will display two other buttons,one to look the image and one for deleting.

Upvotes: 0

Views: 404

Answers (1)

Gabriel Barreto
Gabriel Barreto

Reputation: 6421

You can use an ngIf/else to show the buttons if Allega verbale is clicked. In your .ts file you'll have:

export class YourPage {
  // just an property to control whose button is shown
  public allegaClicked: boolean = false;
}

Then in your HTML

<ion-content>
  <!-- your content -->
  ...
  <!-- use and ngIf to show your button, when clicked it'll set allegaClicked to the oposite value and show cameraButtons block -->
  <button ion-button (click)="allegaClicked = !allegaClicked" *ngIf="!allegaClicked; else cameraButtons">Allega Verbale</button>
  <!-- when ngIf is false it'll show that block, the else statement only works with ng-template, if you want another element instead of using an ng-template you can use *ngIf="allegaClicked", it's up to you -->
  <ng-template #cameraButtons>
    <div>
      <button ion-button>Camera</button>
      <button ion-button>Gallery</button>
    </div>
  </ng-template>
</ion-content>

This way you can simply switch which buttons to show.

Upvotes: 1

Related Questions