Navbar button displaying incorrect

Ionic Framework ionic-v3
1

I’m having trouble with dynamic button in navbar. Here’s the code:

<ion-header>
    <ion-navbar>
        <button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>{{action.name}}</ion-title>

        <ion-buttons end>
            <button *ngIf="view.searchable">
                <ion-icon name="search"></ion-icon>
            </button>
            <button *ngIf="view.creatable">
                <ion-icon name="create"></ion-icon>
            </button>
        </ion-buttons>
    </ion-navbar>
</ion-header>

Because buttons are displayed base on condition, it causes issue in displaying.

It displaying fine with:

<ion-buttons *ngIf="view.searchable" end>
    <button>
        <ion-icon name="search"></ion-icon>
    </button>
</ion-buttons>
<ion-buttons *ngIf="view.creatable" end>
    <button>
        <ion-icon name="create"></ion-icon>
    </button>
</ion-buttons>

It’s not big issue but it makes the code looks complicated and hard to track.

Anyone has other solution for that? Please help.