Html 删除最后一个数组元素并返回数组，同时分别返回删除的元素

我有一个对象数组。屏幕上有两张桌子。我希望在顶部表格中有n-1个元素，在底部列中显示最后一个元素

HTML顶部表格：

<th>name</th>
<th>age</th>
<tr *ngFor="let key of array">
<td> {{key.name}}</td>
<td> {{key.age}}</td>

HTML bottom table:
<th></th>
<th>age</th>
<tr *ngFor="let key of array">
<td></td>
<td> {{key.age}}</td>

名称
年龄
{{key.name}
{{key.age}
HTML下表：
年龄
{{key.age}

假设有5个元素，4个应该显示在顶部，最后一个显示在底部。在api响应中，我得到的是一个对象数组，最后一个对象应该始终位于表的底部。另外，最后一个表没有名称列。它返回一个字符串“Final Name”。这是否可用于检测if

name===Final name

是否将其从数组中删除，并在其他位置显示？ 它的for循环条件应该是什么？我应该从数组中切片最后一个元素并将其存储在.ts文件中的临时数组中吗

---

您可以创建一个变量来存储ts文件中的最后一个数组对象，然后将数组弹出到此变量。例如：

组件1.ts：

export class YourComponent {
lastItem: YourType;

这将删除最后一项并将其分配给lastItem变量，该变量可用于填充底部表格

HTML下表：

<th></th>
<th>age</th>
<tr>
<td></td>
<td> {{lastItem.age}}</td>

年龄
{{lastItem.age}

您可以创建一个变量来存储ts文件中的最后一个数组对象，然后将数组弹出到此变量。例如：

组件1.ts：

export class YourComponent {
lastItem: YourType;

这将删除最后一项并将其分配给lastItem变量，该变量可用于填充底部表格

HTML下表：

<th></th>
<th>age</th>
<tr>
<td></td>
<td> {{lastItem.age}}</td>

年龄
{{lastItem.age}

好的，首先，像这样使用*NGF

*ngFor=“让项中的项；让i=索引”

您可以应用如下条件

*ngIf=“i！=array.length”

---

通过使用索引，您可以单独打印最后的数组元素

好的，首先使用*ngFor这样

*ngFor=“让项中的项；让i=索引”

您可以应用如下条件

*ngIf=“i！=array.length”

---

通过使用索引，您可以分别打印最后的数组元素

我得到的响应如下：this.array=res；const finalName=this.array.pop（）；在html中，我正在尝试ngFor=“let key of finalName”{{{key.finalName}}这是行不通的。我对angularI比较陌生，我已经编辑过，添加了更多细节。在底部的表中，无需执行ngFor循环，因为该表中只有一项。只需在表单元格中直接按名称引用变量，因此{lastItem.age}（或您调用的任何变量）而不是{{key.age}，因为您现在没有使用for循环“key”变量。确保变量是在组件类定义中声明的，而不是在函数中声明的，这样它就可用于模板；const finalName=this.array.pop（）；在html中，我正在尝试ngFor=“let key of finalName”{{{key.finalName}}这是行不通的。我对angularI比较陌生，我已经编辑过，添加了更多细节。在底部的表中，无需执行ngFor循环，因为该表中只有一项。只需在表单元格中直接按名称引用变量，因此{lastItem.age}（或您调用的任何变量）而不是{{key.age}，因为您现在没有使用for循环“key”变量。确保变量是在组件类定义中声明的，而不是在函数中声明的，以便模板可以使用该变量。