如何根据角度 6 中的下拉选择显示列箭头图标？

Question

请看下图，有一个下拉按钮叫排序 所有标题都在那里。如果我选​​择任何标题 应该显示向上和向下箭头。现在它显示在所有 标题。

<th abs-table-header [sortable]="true" [sortableContent]="HeaderData[1].value">{{HeaderData[1].text}}</th>
<th abs-table-header [sortable]="true" [sortableContent]="HeaderData[4].value">{{HeaderData[4].text}}</th>
<th abs-table-header [sortable]="true" [sortableContent]="HeaderData[3].value">{{HeaderData[3].text}}</th>             
<th abs-table-header [sortable]="true" [sortableContent]="HeaderData[5].value">{{HeaderData[5].text}}</th>

这里 [sortable]="true" 为我提供了向上和向下箭头图标。所以如何根据选择显示该图标，而不是在所有标题处显示。

Answer 1

您可以根据下拉列表的值将<th> 替换为ngIf。

<th *ngIf="sortSelectValue != HeaderData[1].text" abs-table-header>{{HeaderData[1].text}}</th>
<th *ngIf="sortSelectValue == HeaderData[1].text" abs-table-header [sortable]="true" [sortableContent]="HeaderData[1].value">{{HeaderData[1].text}}</th>