Angular 如何在具有两种不同条件的单个html元素上应用两个ngIf

如何在一个html元素上应用两个ngIf，使用两种不同的条件，如

div class="sidebar" *ngIf="!this.router.url === '/login'">
    <!-- *ngIf="!route.isActive('/signup' || '/login')  " -->
<div class="sidebar-overlay"></div>
<div class="sidebar-coverlay">
    <div class="sidebar-logo">...

div class=“sidebar”*ngIf=“！this.router.url==”/login'>
...

而不是像这样的条件：

!route.isActive('/signup' || '/login')

<div *ngIf="!route.isActive('/signup') && !route.isActive('/login')">
    // your code
</div>

您应将其作为两个单独的条件编写：

*ngIf="!route.isActive('/signup') && !route.isActive('/login')"

因此，您的

div

应该如下所示：

<div class="sidebar" *ngIf="!route.isActive('/signup') && !route.isActive('/login')">

---

您可以使用&&operator，如下所示：

!route.isActive('/signup' || '/login')

<div *ngIf="!route.isActive('/signup') && !route.isActive('/login')">
    // your code
</div>

---

意味着，条件1和条件2都必须为真才能显示div中的内容

我们可以使用| |运算符吗？是的，你需要公式化，这意味着，构建逻辑。| |是OR运算符，因此可以组合（条件1）或（条件2）等条件。