Angular6 如何在angular 6中设置验证复选框的图像

我正在尝试在验证条件下设置选中和未选中复选框的图像。选中复选框应为选中图像。未选中的复选框应为未选中的图像。但不起作用。我已使用angular 6反应形式方法

将控制无效的条件更改为：

单元{i+1}

{{unit.name}


提交
您已选中所有复选框：：{{fg.valid}

.main.ng-touch.ng-invalid input[类型=复选框]+标签：：before{
背景图片：url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Red_checkbox-unchecked.svg/768px-Red_checkbox-unchecked.svg.png)！重要；
背景重复：不重复！重要；
}
.main.ng-touch.ng-valid输入[type=checkbox]+标签：：before{
背景图片：url(https://upload.wikimedia.org/wikipedia/commons/thumb/5/54/Red_checkbox-checked.svg/600px-Red_checkbox-checked.svg.png)！重要；
背景重复：不重复！重要；
}
.ng无效{
颜色：红色；
}
.ng有效{
颜色：蓝色；
}

然后检查你的css类，当我将它更改为时。控制无效，它就会工作。我知道的不多。

---

希望有帮助

图片应该来自cssI更新了我的问题，例如：Check it@KrithikCan你可以为checkbox应用checked和unchecked图片吗？我想你可以这样做：为2个状态创建2个css类，在ngClass中使用fg.get（'bUnits'）。at（I）。value你想将checkbox设置为图片还是期望值？