Question

我有一个div，当我的两个条件为空时，我希望它消失，此刻它会显示一个空白的div。

<div class="card statOf" *ngIf="selectedState._id">
        <div class="letter" *ngFor="let letter of letters">
            <div class="letter-user" *ngIf="letter.user">
                <span>
                    {{ letter.user }}</span>
                <div *ngIf="dateLastHeart">
                    <span>
                        {{ dateLastHeart }} </span>
                </div>
            </div>
    </div>
</div>

此刻，当它们之一为空时，它就像我想要的那样工作，但是当它们都为空时，它显示了类卡statOf，我想在它们都为空时将其隐藏，有没有办法做到这一点？？

Answer 1

AND运算符（... && ...）。我可以想象这样的事情（我不确定您在想什么变量）：

<div class="card statOf" *ngIf="selectedState && selectedState._id && letters && letters.length > 0">
  <div class="letter" *ngFor="let letter of letters">
     <div class="letter-user" *ngIf="letter.user">
        <span>{{ letter.user }}</span>
        <span *ngIf="dateLastHeart"> {{ dateLastHeart }} </span>
     </div>
  </div>
</div>

编辑

您无权访问外部div上的“ letter.user”，因为它不在* ngFor范围内。您可以尝试检查字母数组是否为空。

<div class="card statOf" *ngIf="letters && letters.length > 0 && dateLastHeart">
  <div class="letter" *ngFor="let letter of letters">
     <div class="letter-user" *ngIf="letter.user">
        <span>{{ letter.user }}</span>
        <span>{{ dateLastHeart }} </span>
     </div>
  </div>
</div>

编辑

您说：

我希望它们都不为空时不可见

* ngIf是一个正表达式，表示：..condition ..

因此，如果您只想在两个容器都为null时隐藏容器，则正确的表达式为：

<container *ngIf="variableA || variableB"> ...

这意味着仅在设置了variableA或variableB时才显示容器

带条件的角度模板ngIf

1 个答案:

编辑

编辑