Question

我有2个数组，例如

["A", "B", "C", "D", "E"]
[1, 2, 3, 4, 5]

如何使用* ngFor以相反的顺序将这些显示为键值对？像E：5 D：4 ......

Answer 1

您可以使用Array.prototype.reverse()方法来反转值，然后就可以得到它：

@Component({
  selector: 'my-app',
  template: `
    <ul>
      <li *ngFor="let str of strArr; let i=index">{{str}} : {{numArr[i]}}</li>
    </ul>
  `,
})
export class App {
  strArr: Array<string> = ["A", "B", "C", "D", "E"];
  numArr: Array<number> = [1, 2, 3, 4, 5];

  constructor() {
    this.strArr.reverse(); // reverse the values ["E", "D", "C", "B", "A"]
    this.numArr.reverse(); // reverse the values [5, 4, 3, 2, 1]
  }
}

Demo @Plnkr

Answer 2

您可能想尝试编写一个接收两个数组并返回已排序键值对数组的组件函数。在您的函数中执行所有基本错误检查，然后在视图中调用您的函数，类似于：

*ngFor="let keypair of getKeyPairs(charArray, intArray)"

angular1的分拣管道从角度2中移除，因此您必须自己实施分拣。

Answer 3

使用* ngFor的索引语法。这是* ngFor的document。并且不要忘记使用array.reverse作为目标数组。

assets/javascripts/application.js

Angular2：使用* ngFor反向显示2个数组作为键值对

3 个答案: