如何在angular 8HTML中只显示100个数据中的5行,并在屏幕上按降序显示时直接对它们进行排序

如何在angular 8HTML中只显示100个数据中的5行,并在屏幕上按降序显示时直接对它们进行排序,html,angular,angular8,Html,Angular,Angular8,我使用了[row]属性,但仍然不起作用,当数据反映在UI上时,我希望它按降序排列。谁能告诉我在不添加排序图标的情况下是如何完成的 更多 {{col.header}} {{rowData[col.field]} --> {{rowData.atomName} {{rowData.processName} {{rowData.executionTime}日期:'MM/dd/yyyy'}({rowData.executionTime}日期:'h:MM:ss a'}) 它看起来更像Angular J

我使用了[row]属性,但仍然不起作用,当数据反映在UI上时,我希望它按降序排列。谁能告诉我在不添加排序图标的情况下是如何完成的

更多 {{col.header}} {{rowData[col.field]}

-->
{{rowData.atomName}
{{rowData.processName}
{{rowData.executionTime}日期:'MM/dd/yyyy'}({rowData.executionTime}日期:'h:MM:ss a'})
  • 它看起来更像Angular Js,而不是Angular 8,但如果是指Angular 8- 唯一可能的解决方案是在TS文件中使用数组排序(请参阅链接-)。然后使用*ngFor和*ngFor内的索引仅显示5个排名靠前的结果
  •         </tr>
    
        </ng-template>-->
                    <ng-template pTemplate="body" let-rowData let-columns="columns">
                        <tr [pSelectableRow]="rowData">
                            <td style="width:300px">{{rowData.atomName}} </td>
                            <td style="width:300px" (click)="show(rowData.message,op2.show($event))" pTooltip="View" tooltipPosition="top" tooltipStyleClass="custom-tooltip">
                                {{rowData.processName}}<!--</td>-->
                                <!--<td style="width:20px">-->
    
                                
    
                            </td>
                            <td style="width:20px">
                                <!--{{rowData.executionTime}}-->
                                {{rowData.executionTime | date :'MM/dd/yyyy' }} ({{rowData.executionTime | date :'h:mm:ss a'  }})
                            </td>
                        </tr>
                    </ng-template>
                   
                </p-table>
            </p-panel>
           
        </div>