Question

我有两个链接。我想显示链接，如果Portfolios.length === 0“

还有另一个链接，如果Portfolios.length> 0“。

我这样尝试：

<p *ngIf="portfolios.length === 0" [attr.data-resource-key]="resourceKeys.dashboardUwPortfolio">
       <a>{{resources.dashboardUwPortfolio}}  </a>
       <a  [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.portfolioDashboardAlleLink"> {{resources.portfolioDashboardAlleLink}}</a>
 </p>

所以这是一个链接：

[attr.data-resource-key]="resourceKeys.dashboardUwPortfolio">
       <a>{{resources.dashboardUwPortfolio}}

这是第二个链接：

<a  [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.portfolioDashboardAlleLink"> {{resources.portfolioDashboardAlleLink}}</a>

但是现在两个链接都可见。

谢谢

我这样子：

 <p [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.dashboardUwPortfolio">
        <a *ngIf="portfolios.length === 0">{{resources.dashboardUwPortfolio}}</a>
        <a  *ngIf="portfolios.length !== 0" [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.portfolioDashboardAlleLink"> {{resources.portfolioDashboardAlleLink}}</a>
 </p>

Answer 1

问题是您的结构指令需要针对要隐藏/显示的内容。您还应该为其他网址定义显示条件。

<p [attr.data-resource-key]="resourceKeys.dashboardUwPortfolio">
       <a *ngIf="portfolios.length === 0">{{resources.dashboardUwPortfolio}}</a>
       <a  *ngIf="portfolios.length !== 0" [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.portfolioDashboardAlleLink"> {{resources.portfolioDashboardAlleLink}}</a>
</p>

Answer 2

附有else和标签<ng-template>的条件可能是最干净的方法。您可以这样定义一个条件：

<span *ngIf="portfolios.length === 0; else otherLink">
  {{resources.dashboardUwPortfolio}}
</span>

然后，将<ng-template>部分与 otherLink 的锚点添加到模板中。

<ng-template #otherLink>
  <span>
    <a [routerLink]="portfolioRoute" [attr.data-resource-key]="resourceKeys.portfolioDashboardAlleLink"> {{resources.portfolioDashboardAlleLink}}</a>
  </span>
</ng-template>

如果条件为真，则前者显示，否则为后者。

显示/隐藏角度链接

2 个答案: