模板内带有“routerLink”的三元运算符答案

【问题标题】：Ternary operator with `routerLink` inside the template模板内带有“routerLink”的三元运算符
【发布时间】：2021-06-02 09:39:24
【问题描述】：

你知道如何在routerLink 中使用三元运算符吗？

现在是这样的：

<ion-button *ngIf="event?.evId"
      routerLink="/event/event-details/{{event?.evId}}">
            Cancel
</ion-button>

<ion-button *ngIf="!event?.evId" routerLink="/event"> Cancel
 </ion-button>

我想在这里使用三元运算符并完全删除一个部分。该怎么做？

Note 我可以在 TS 文件中做到这一点。但是不使用 TS 文件怎么办呢？

【问题讨论】：

event?.evId ? '/event/event-details/event?.evId' : '/event'有什么问题
@AlirezaAhmadi 不，它不工作。它需要这样的 URL： url: event/event-details/event%3F.evId
这个怎么样：[routerLink]="event?.evId ? ['/event/event-details/event?.evId'] : [' '/event']"
见this第二个答案

标签： angular typescript ionic-framework

【解决方案1】：

OP 的

  <ion-button [routerLink]="event?.evId ? '/event/event-details/'+ event?.evId : '/event'"> 
       Cancel
   </ion-button>

原创

你可以这样bind to any attribute

[routerLink]="event?.evId != null ? '/event/event-details/'+event.evId : '/event' "

【讨论】：

没有。它不工作。它需要这样的 URL：url: "event/event-details/event%3F.evId"
对不起，我更新了我的答案，我错过了一些东西，在字符串中包含了属性访问器。