Angular ngFor没有按正确的顺序迭代

Question

从后端获取一些数组后，我会得到一个数组数组，我会迭代该数组以使用*ngFor创建一个表。我把它存储在一个名为"；lista"；。这是我得到的数组：

0: (4) ["12.167.143-3", "Ximena Araya Guajardo", "D", "2021-04-19T04:00:00.000Z"]
1: (4) ["18.545.597-1", "Johanna Muñoz Infante", "A2", "2021-04-19T04:00:00.000Z"]
2: (4) ["12.167.143-3", "Ximena Araya Guajardo", "E", "2021-04-19T04:00:00.000Z"]
3: (4) ["23.456.789-2", "Nombre_1 ApellidoPaterno_1 ApellidoMaterno_1", "C", "2021-04-20T04:00:00.000Z"]
4: (4) ["16.134.145-8", "Luciano andres Arce Sepulveda", "A1", "2021-04-20T04:00:00.000Z"]

如果你看到的话，第一个寄存器是2021-04-19，最后一个是2021-04-20。

它运行良好，渲染良好，但现在我需要按日期对表进行排序，必须首先显示最近的日期。我用这个来反转列表：

this.listaOrderedByDate = this.lista.sort(function(a, b) {
return (b[3] < a[3]) ? -1 : ((b[3] > a[3]) ? 1 : 0);
});

其中[3]是传递给排序方法的每个数组中日期的索引。

名单颠倒了：

0: (4) ["23.456.789-2", "Nombre_1 ApellidoPaterno_1 ApellidoMaterno_1", "C", "2021-04-20T04:00:00.000Z"]
1: (4) ["16.134.145-8", "Luciano andres Arce Sepulveda", "A1", "2021-04-20T04:00:00.000Z"]
2: (4) ["12.167.143-3", "Ximena Araya Guajardo", "D", "2021-04-19T04:00:00.000Z"]
3: (4) ["18.545.597-1", "Johanna Muñoz Infante", "A2", "2021-04-19T04:00:00.000Z"]
4: (4) ["12.167.143-3", "Ximena Araya Guajardo", "E", "2021-04-19T04:00:00.000Z"]

现在，具有索引为3的元素(日期为2021-04-20(的数组位于顶部，具有日期2021-04-19的数组位于底部。

然而，如果我使用*ngFor迭代；listaOrderedByDate"；在HTML中，它仍然打印原始数组(名为"lista"的数组(，呈现顺序根本没有改变。尽管倒置数组的日志说明了一些事情，但最终视图说明了另一件事，我仍然在顶部显示最旧的日期，在底部显示新的日期。它不是按自然顺序迭代的。我不知道为什么。你能帮我一把吗？

Answer 1

我认为this.listaOrderByDate只是指向与this.lista相同的内存位置。您可以使用Spread操作符为this.listaOrderByDate数组分配新内存。

this.listaOrderedByDate = [...this.lista].sort(function (a, b) {
return (b[3] < a[3]) ? -1 : ((b[3] > a[3]) ? 1 : 0);
});