满足特定条件时如何隐藏Angular5 / HTML中的链接

Question

我在 Angular5/html 中工作。我有点卡在某一点上。

我有一个页面，我可以在其中添加不同的帐户。我有一个删除这些帐户的链接。现在我希望该链接仅在添加超过 1 个帐户时显示。对于仅添加的 1 个帐户，我不希望显示我的帐户删除链接。

我将如何将此条件合并到下面的代码中？我的意思是，如果我使用 ngif，但我将如何响应 ngif 来隐藏帐户删除链接？

对于 ngif 中的条件，我可以在 html 中指定它吗（类似于 count 为 1 或 i 为 0，因为 count 在这里告诉帐户的数量）还是我需要在我的 ts 中为它编写函数文件。

<li *ngFor="let ac of Accounts; let i = index;">
  <div class="header">
    <h2>{{'account.title' | translate : { count: i + 1 } }}</h2>
    <a [routerLink]="" (click)="removeAccount(i)">{{'account.remove' | translate}}</a>
  </div>
  <account [data]="ac" [id]="i"><account>
</li>

Answer 1

你可以在锚标签上使用*ngIf。

我们可以使用数组Account.length的length属性来获取账户数，然后查看是否大于> 1。

仅当Accounts 数组中的元素超过 1 个时才会显示在锚标记下方。

<li *ngFor="let ac of Accounts; let i = index;">
    <div class="header">
      <h2>{{'account.title' | translate : { count: i + 1 } }}</h2>
      <a *ngIf="Accounts.length > 1" [routerLink]="" (click)="removeAccount(i)">{{'account.remove' | translate}}</a>
    </div>
    <account [data]="ac" [id]="i">
      <account>
</li>