想用 ngif 在 div 内加载 img，并且当 ngif==false答案

【问题标题】：Want to load img inside the div with the ngif, and when the ngif==false想用 ngif 在 div 内加载 img，并且当 ngif==false
【发布时间】：2019-02-11 08:27:47
【问题描述】：

基本上，我有一个带有 *ngIf 条件的 div，但我在这个 div 中也有一个 img。这是一个登录页面，我想为不同类型的用户显示不同的登录页面。这就是我使用 ngIf 的原因。但是，在我单击用户名输入字段之前，不会加载 img。无论如何我可以解决这个问题吗？抱歉，任何不清楚的描述，仍在提高我的英语水平。

这是问题的简单版本：

<div *ngIf="somecondition">
<img> 
</div>

所以我希望无论ngif是真还是假都可以加载img，并且img必须在div内。

感谢您的帮助..

【问题讨论】：

你必须把条件放在标签之后。
谢谢 Bhavin，但我应该申请什么样的条件？我用 div 应用 *ngIf="isConsumerLogin==false"。
您必须从当前 div 中删除条件并在 div 之后应用相同的条件。这是我认为的唯一解决方案。
但这不是我想要的。因为基于不同的用户登录，我想在登录页面显示不同的img。无论如何，谢谢你的帮助。

标签： javascript html angular angular-ng-if

【解决方案1】：

我猜你想要的是“加载”（不显示），无论 *ngIf 的条件是...

尝试使用[style.display]="condition ? '' : 'none'" 而不是*ngIf="condition"

我猜发生的情况是，当条件为假时，img 不在 dom 中，因此浏览器不会加载它...当你隐藏它，而不是通过 *ngIf 从 dom 中删除它时，图像将加载...

【讨论】：

@Alex 如果答案解决了您的问题，请考虑用粗标记标记它

【解决方案2】：

所有代码使用 2 个 div，其他只有图像

<div *ngIf="somecondition">
   <-- some code-->
    <img>
    <-- some code--> 
</div>

 <--without some code--> 
<div *ngIf="!somecondition">
   <img> 
</div>

【讨论】：

对两个 div 应用相同的条件？