gpt4 book ai didi

angular - 如何将 ngFor 重复限制为 Angular 中的一些项目?

转载 作者:太空狗 更新时间:2023-10-29 16:45:46 25 4
gpt4 key购买 nike

我的代码:

<li *ngFor="let item of list; let i=index" class="dropdown-item" (click)="onClick(item)">
<template [ngIf]="i<11">{{item.text}}</template>
</li>

我试图在任何时候只显示 10 个列表元素。正如 answer here 中所建议的,我使用了 ngIf 但这会导致页面上显示空列表项(超过 10 个)。

最佳答案

这对我来说似乎更简单

<li *ngFor="let item of list | slice:0:10; let i=index" class="dropdown-item" (click)="onClick(item)">{{item.text}}</li>

更接近你的方法

<ng-container *ngFor="let item of list; i as index">
<li class="dropdown-item" (click)="onClick(item)" *ngIf="i<11">{{item.text}}</li>
</ng-container>

备选

<ng-template ngFor let-item [ngForOf]="list" let-i="index">
<li class="dropdown-item" (click)="onClick(item)" *ngIf="i<11">{{item.text}}</li>
</ng-template>

关于angular - 如何将 ngFor 重复限制为 Angular 中的一些项目?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37818677/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com