Ion Button custom colors

#1

I’m trying to set dynamic colors for the background-color and color of an ion-button.
What I’ve achieved so far:
20

My problem: The button color overlays the button outline.
Is this an Ionic issue, how can I get around this?

My code:

Template:

<ion-button *ngFor="let d of districts" shape="round"
                (click)="districtClicked(d)"
                [ngStyle]="getDistrictStyle(d)"
                color="{{getDistrictColors(d)[0]}}">
        {{getDistrictName(d)}}
</ion-button>

Method in my Component:

getDistrictStyle(district: District) {
        if (district) {
            const colors = this.colorGenerator.getDistrictColors(district);
            return {
                'background-color': colors[0],
                'color': colors[1]
            };
        }
 }

getDistrictColors(district: District) simply returns an array with two colors in hex (red and white in this case).