选中复选框时更改标签样式-Ionic 3

Question

你好...我有一个 ion-checkbox，当它被选中时，它应该改变一些 ion-label 的样式。

 <ion-label>{{item.itemName}}</ion-label>
 <ion-checkbox [(ngModel)]="item.checked" (ionChange)="check(item)" color="primary"></ion-checkbox>

当我点击复选框时，与该复选框关联的离子标签应该得到：

 text-decoration: line-through;

当它被取消选中时，文本装饰应该会再次正常...

我尝试在 SCSS 中使用 ion-checkbox:checked，但它似乎不起作用。

关于如何实现这一点的任何想法？

Answer 1

你可以使用 style 属性绑定，像这样：

<ion-label [style.text-decoration]="item.checked ? 'line-through' : 'none'">{{ item.itemName }}</ion-label>

请查看this working Stackblitz project。