Ionic 如何在ngStyle中应用布尔函数

x8goxv8g 于 2023-03-11 发布在 Ionic

关注(0)|答案(1)|浏览(171)

<div *ngFor= “ let singleorder of order.order”>
    <p [ngStyle]="
      'color':(single order.status === 'CONFIRM' )? 'green' : 'red' ,
       'background' : (single order.status === 'CONFIRM')? '#e4f4eb': '#f7d0c7'
    }">. {{single order.status}}>

</div>

我希望当status的值为CONFIRM时，背景色和颜色为绿色，当status的值为CANCELLED时，背景色和颜色也显示为红色

ionic-framework

来源：https://stackoverflow.com/questions/75681875/how-to-apply-boolean-functions-in-ngstyle

1条答案

按热度按时间

u4dcyp6a1#

基于documentation，这是正确的语法（注意花括号）。

<p [ngStyle]="{
  'color': singleorder.status === 'CONFIRM' ? 'green' : 'red',
  'background': singleorder.status === 'CONFIRM' ? '#e4f4eb': '#f7d0c7'
}">
  {{singleorder.status}}>
</p>

由于您要将多个样式属性基于相同的条件，因此定义几个CSS类并使用ngClass或class binding可能会更简洁。

赞(0）回复(0）举报 2023-03-11

我来回答

Ionic 如何在ngStyle中应用布尔函数

1条答案

相关问题

热门标签

最新问答