是什么导致隐藏行为不同？

Question

我想显示/隐藏screen值，但是有显示的图案和没有显示的图案。

---

好

<div class="container mt-3 mb-5" [hidden]="!screen">
  <div class="d-flex justify-content-center">
    <button (click)="sample()" class="btn btn-danger" role="button">
      sample
    </button>
  </div>
</div>

NG（按钮不会消失。）

<div class="d-flex flex-row-reverse m-2" [hidden]="screen">
  <button
    (click)="sample($event)"
    [disabled]="enInputForm.invalid || isLoading"
    class="btn btn-danger"
  >
    <span [hidden]="isLoading">submit</span>
    <span
      [hidden]="!isLoading"
      class="spinner-border spinner-border-sm"
      role="status"
      aria-hidden="true"
    ></span>
  </button>
</div>

为什么显示上有区别？

---

• Angular CLI：8.3.19
• 节点：12.12.0
• 角度：8.2.14
• 引导程序：“ ^ 4.3.1”