在Angular中的*ngFor中使用三元运算符

Question

以下是我如何迭代数组项

<div *ngFor="let car of cars">
{{car}}
</div>

在使用类似的三元运算符执行检查后，我想添加一个到数组项的链接

{{car === 'Jeep' ?
<a href="https://jsonplaceholder.typicode.com/" target="_">car</a> 
: car }}

这可能吗？有人能帮忙吗？

我使用CodeSandbox创建了一个工作示例

Answer 1

您可以使用*ngIf ... else

<div *ngFor="let car of cars">
<a *ngIf="car === 'Jeep'; else other_content" href="https://jsonplaceholder.typicode.com/" target="_">{{car}}</a> 
<ng-template #other_content>{{car}}</ng-template>
</div>

Answer 2

你可以试试这个。。。

<div>
<h1>
Welcome to {{ title }}!
</h1>
<div *ngFor="let car of cars">
<a *ngIf="car === 'Audi'" href="https://jsonplaceholder.typicode.com/" target="_">{{car}}</a> 
<a *ngIf="car === 'BMW'" href="https://jsonplaceholder.typicode.com/" target="_">{{car}}</a> 
<a *ngIf="car === 'Jeep'" href="https://jsonplaceholder.typicode.com/" target="_">{{car}}</a> 
</div>
</div>