Как я могу связать цвет фона ионной кнопки в ионной 4

Question

Мне нужна динамическая цветная кнопка в ionic4. Это мой код, но не работает

<ion-button [style.--background]="colorVarialble">Buttton</ion-button>

Answer 1

Вы можете использовать так:

variables.css

 --ion-color-btn: #ef5365;

создать класс в вашем home.page.scss

.btncolor {
  --background: var(--ion-color-btn);
}

и после добавления класса в вашу кнопку:

<ion-button shape="round" class="btncolor">
  Get Started
</ion-button>

надеюсь, это поможет вам:)

Answer 2

Вы можете сделать это следующим образом

IONIC 4

  <ion-button style="--background:red">Red</ion-button> // //whateve color you can give

IONIC 3

<button ion-button [ngStyle]="{'background-color':'red'}">Butttons</button> //whateve color you can give

Демонстрация в v3