代码之家 › 专栏 › 技术社区 › aloisdg

如何跳过*ngFor中的第一项和最后一项

angular

aloisdg · 技术社区 · 6 年前

我有一份物品清单。第一行是一种标题。最后一行是一种页脚。我的页眉和页脚需要特殊处理,所以我不想通过这个循环显示。

json码:

{
  "items": [1,2,3,4]
}

我现在的代码:

<ul *ngFor="let item in items">
 <li>{{item}}</li>
</ul>

输出应为:

<ul>
 <li>2</li>
 <li>3</li>
</ul>

3 回复 | 直到 6 年前

aloisdg 6 年前

index:number:iterable中当前项的索引。

<ul>
    <ng-container *ngFor="let item of items; let i=index">
        <li *ngIf="i != 0 && i != items.length-1">{{item}}</li>
    </ng-container>
</ul>

aloisdg 6 年前

<ul>
    <li *ngFor="let item of items | slice:1:items.length-1">{{item}}</li>
</ul>

aloisdg 4 年前

可以先使用局部变量,后使用局部变量:

last:boolean:当项是iterable中的最后一项时为True。

<ul>
    <ng-container *ngFor="let item of items; first as isFirst; last as isLast">
        <li *ngIf="!isTrue && !isLast">{{item}}</li>
    </ng-container>
</ul>

推荐文章

Kiara · 根据条件角度显示多个模板

1 年前

IonicMan · 剑道网格在宽度过大时不显示某些列

1 年前

Piotr Deja · 如何在subscribe方法中为参数赋值,然后从组件内部的任何位置检索该值?

1 年前

Ben5 · 服务器端总是接触FormControl

1 年前

allforthenoob · 我该怎么分类?

1 年前

Hamid Elouardaoui · 角度生成:发生未处理的异常:服务不再运行

1 年前

Hugh Jones · 如何创建适用于多个来源的自签名开发证书

1 年前

jthorn · 角度对象未在HTML中显示

1 年前

clem · 如何在Angular应用程序中突出显示页面的一部分?

2 年前

Kael · 在html表格中显示关系api数据-角度

2 年前