Floating action button an ion-toolbar


#1

I use on several pages a floating action button (only for android devices). This button is on each page inserted with the following code:

<button fab danger fab-bottom fab-right (click)="showModal()" *ngIf="isAndroid">
      <ion-icon name='add'></ion-icon>
</button>

This is working for me until I inserted on a single page an ion-toolbar with the following code:

<ion-toolbar position="bottom">
    <ion-buttons start small>
        <button royal (click)="last(slides)">
            <ion-icon name="arrow-back"></ion-icon>
        </button>  
    </ion-buttons>  
    <ion-buttons end small>
        <button royal (click)="next(slides)">
            <ion-icon name="arrow-forward"></ion-icon>
        </button>
    </ion-buttons>    
</ion-toolbar> 

On this page I use ion-slides with pager=“false” and the two buttons inside the ion-toolbar are for changing the slide.

The problem is, that the floating action button isn’t working on this single side. On the other sides there is no problem.

Is there a solution?


#2

I found a solution on my own: I put the code of the floating action button into ion-slides.