Question

我正在使用以下所示的技术开发应用程序。我如何使用* ngIf指令更改另一张图像？我会更准确地解释我的意图；我有两个图像（男性符号♂和女性符号♀），当我使用“ gender == M”时，我必须显示男性符号，而当我使用“ gender == F”时，我必须显示女性符号。谢谢大家！

我当前使用的技术：

离子4.10.2
角度6
8.1.2（cordova-lib@8.1.1）
TypeScript
Visual Studio代码

Answer 1

您可以按以下方式使用

<img src="gender == 'M'? 'your image path for male': 'your image path for Female'"/>

在上面使用无需使用ngIf指令

Answer 2

您可以使用字体真棒图标，而不是使用图像

<div *ngIf="gender == 'F'; else elseBlock">
  <i class="fa fa-venus" aria-hidden="true">
  </i>
</div>
<ng-template #elseBlock>
  <i class="fa fa-mars" aria-hidden="true">
  </i>
</ng-template>

Answer 3

我解决了，

<img *ngIf="response.gender == 'F'" src="female.png" slot="start" />
<img *ngIf="response.gender == 'M'" src="male.png" slot="start" />

如何使用* ngIf指令更改图像？

3 个答案: