angular.js 如何在html里根据ng-class的判断条件显示不同的图片
时间: 2024-02-03 07:14:39 浏览: 174
Angular 绑定数据、条件判断、加载图片、【ngClass】 【ngStyle】、Angular管道 、示例代码.zip
可以使用ng-class指令来根据判断条件来动态设置class,然后在CSS中设置不同的背景图片。
例如,假设有两个图片"image1.jpg"和"image2.jpg",根据ng-class的判断条件,显示不同的图片。
HTML代码如下:
```
<div ng-class="{'image1': condition1, 'image2': condition2}"></div>
```
CSS代码如下:
```
.image1 {
background-image: url('image1.jpg');
}
.image2 {
background-image: url('image2.jpg');
}
```
其中,'condition1'和'condition2'是根据实际情况来判断的条件。当'condition1'为true时,显示'image1.jpg',当'condition2'为true时,显示'image2.jpg'。
阅读全文