如何在Angular的ngFor中判断当前索引是否为数组最后索引？

当然可以啦！Angular的*ngFor其实自带了专门的变量来判断是否为最后一项，另外也可以通过索引结合数组长度来实现，下面给你详细说两种方法：

方法一：使用*ngFor内置的last变量（推荐） #

这是最直接省心的方式，Angular已经帮我们封装好了这个判断逻辑，不需要自己手动计算索引。你只需要在*ngFor的表达式里声明一个last变量：

<div *ngFor="let object of Objects; let i = index; let isLast = last">
  <!-- 你的内容 -->
  <span *ngIf="isLast">这是最后一项</span>
</div>

这里的isLast会自动被Angular赋值为布尔值，当前项是数组最后一项时为true，否则为false。这种方法的好处是不需要关注数组长度的变化，Angular会自动帮你同步更新判断结果，非常适合大多数场景。

方法二：通过索引i结合数组长度判断 #

如果你确实想通过索引i来判断，也可以实现。首先在组件类里定义一个变量存储数组的长度（如果数组是静态的或者已经加载完成）：

// 组件类中
objectsLength = this.Objects.length;

然后在模板中通过i === objectsLength - 1来判断：

<div *ngFor="let object of Objects; let i = index">
  <!-- 你的内容 -->
  <span *ngIf="i === objectsLength - 1">这是最后一项</span>
</div>

⚠️ 注意：如果你的数组是异步加载的（比如从API获取），直接赋值objectsLength可能会拿到0或者undefined，这时候可以用可选链操作符或者结合async管道处理：

<!-- 假设Objects是Observable类型 -->
<div *ngFor="let object of Objects$ | async; let i = index">
  <span *ngIf="i === ((Objects$ | async)?.length - 1)">这是最后一项</span>
</div>

不过这种方法相对麻烦，不如第一种内置变量来得简洁。

总结一下，优先使用Angular提供的last变量，既简单又不容易出错～

内容的提问来源于stack exchange，提问作者inoxious