angular 2 ngfor 反向顺序和相同索引答案

【问题标题】：angular 2 ngfor reverse order and same indexangular 2 ngfor 反向顺序和相同索引
【发布时间】：2016-06-09 18:25:52
【问题描述】：

我有一个在面板中显示数组项的应用使用此代码

<div *ngFor="let object of questionAnswer | reverse let i = index" [attr.data-index]="i">
        <p-panel header="{{object.question}}" [toggleable]="true" [collapsed]="true">
            <div class="row">
                <div class="col-sm-6">
                    {{object.answer}}
                </div>
                <div class="col-sm-6">
                    <button type="button" class="paneltools btn btn-default dropdown-toggle" data-toggle="dropdown">
                        <i class="fa fa-cog fa-fw" aria-hidden="true"> </i> <span class="caret"></span></button>
                    <ul class="dropdown-menu" role="menu">
                        <li><a (click)="editShow(i)">Edit</a></li>
                        <li><a (click)="remove(i)">Delete</a></li>
                    </ul>
                </div>
            </div>
        </p-panel>
    </div>

我想以相反的顺序显示项目，以便首先显示较新的项目，并且使用我在这里找到的管道代码可以正常工作

export class ChallengesReversePipe {
transform(value) {
    return value.slice().reverse();
}

}

但我的大问题是，当我这样做时，我得到了一个反向索引号，例如，我需要反向之前的原始索引号顶部项目的索引应该是数组中的最后一个索引号我似乎找不到办法得到它:( 请问有什么帮助吗？

【问题讨论】：

这似乎违反直觉。您正在修改集合（因此也修改了索引顺序）但您想保留原始索引？然后不要使用索引...使用 Id。
您可以（在管道内）将数组中的项目包装在像{index: 1, value: item} 这样的对象中，然后遍历这个返回的对象数组并使用object.id 作为索引。

标签： javascript angular

【解决方案1】：

你可以试试这样的：

[attr.data-index]="questionAnswer.length - i - 1"

【讨论】：

【解决方案2】：

[attr.data-index]="questionAnswer.length - i - 1" 对我不起作用，但我将所有出现的 i 替换为完成工作的 "yourArray.length - i - 1"

【讨论】：