Ionic 4 обновляет фон предметов иона программно - PullRequest
Новая
       34

Ionic 4 обновляет фон предметов иона программно

0 голосов
/ 28 октября 2019

У меня есть что-то вроде этого: 

<ion-item>
     <ion-label class="ion-text-center">{{variable}}</ion-label>
</ion-item>

Мне нужно иметь возможность установить цвет фона элемента ion в любом месте между красным и зеленым на основе результатов программы, поэтому я генерируюзначение "{'background-color':'rgb(#,#,0)'}" в page.ts.

Я не могу использовать [ngStyle]="{'--ion-background':'rgb(#,#,0)'}", так как при изменении значения ionic уже расширил HTML в свой компонент item-native. Мне нужно иметь возможность получить доступ к item-native как-нибудь с помощью [ngStyle] или ng-style или, может быть, что-то вроде [.item-native background]?

Или есть более простые / лучшие способы сделать это?

1 Ответ

0 голосов
/ 29 октября 2019

Мне удалось сделать это следующим образом:

Моя функция устанавливает переменную в page.ts для этого объекта: {'background-color':'rgb(' + function + ',' + function + ',0)'}

HTML: 

<div [ngStyle]="bgColVar">
  <ion-item class="transparentbg">
    <ion-label class="ion-text-center">{{variable}}</ion-label>
  </ion-item>
</div>

SCSS: 

.transparentbg{
    --ion-background-color: transparent;
}

Я обертываю все это в обычный div и динамически устанавливаю его фон, оставляя фон ионных элементов прозрачным.

...