在角度上,如何用If .. then .. else条件实现* ngIf?标签? [英] In angular how to implement *ngIf with If .. then.. else condition inside a <td> tag?
问题描述
我尝试使用ngIf在表块中显示if else条件,但是我无法显示它.
I have tried to show the if else condition inside block of table using ngIf but i am not able to display it.
<tr *ngFor="let client of clients">
<!--here i need to implement it-->
<td *ngIf="!client.auditorGroup"; then
[ngStyle]="titleStyles else [ngStyle]="oldStyles1">{{client.selectionId}}</td>
<td>{{client.selectionDate}}</td>
<td>{{client.selectedBy}}</td>
<td>{{client.panEximNumber}}</td>
<td>{{client.name}}</td>
<td>{{client.address}}</td>
<td>{{client.phoneNumber}}</td>
<td>{{client.selectionType}}</td>
<td *ngIf="!client.auditorGroup" [ngStyle]="titleStyles">Edit
Delete</td>
</tr>
推荐答案
否则,仅在ng-templates上使用,如果您需要条件样式,则可以使用ngClass或仅使用[class.someClass] ="condition"
添加单个类或操纵样式使用[style.'some property']
,因为您使用的是ngStyle,请尝试以下操作
在component.ts中,您可以具有一个根据条件(例如!client.auditorGroup
else and then can only used on ng-templates if you want conditional styles you could use ngClass or just add a single class using [class.someClass] ="condition"
or manipulate the style using [style.'some property']
since you're using ngStyle try this
in your component.ts you can have a function that returns your style depending on conditions such as your !client.auditorGroup
getStyle(value) {
if(!value)
return this.titleStyles;
}else {
return this.oldStyles1;
}
,然后在您的component.html
and then in your component.html
<tr *ngFor="let client of clients">
<!--here i need to implement it-->
<td
[ngStyle]="getStyle(client.auditorGroup)">{{client.selectionId}}</td>
<td>{{client.selectionDate}}</td>
<td>{{client.selectedBy}}</td>
<td>{{client.panEximNumber}}</td>
<td>{{client.name}}</td>
<td>{{client.address}}</td>
<td>{{client.phoneNumber}}</td>
<td>{{client.selectionType}}</td>
<td [ngStyle]="getStyle(client.auditorGroup)">Edit
Delete</td>
</tr>
这篇关于在角度上,如何用If .. then .. else条件实现* ngIf?标签?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!