typescript - 在 Aurelia 模板中......哪些对象是可迭代/可重复的？

Question

Aurelia 文档指出，我们可以将转发器与数组和其他可迭代数据类型(包括对象)以及新的 ES6 标准(例如 Map 和 Set)一起使用。 map 是重复中推荐的方式。例如下面:

<template>
      <p repeat.for="[greeting, friend] of friends">${greeting}, ${friend.name}!</p>
</template>

但是，具体来说，哪些类型的对象(数据结构、集合等)是可迭代/可重复的？ ... 是什么让他们如此？

遍历 typescript-collections 包 ( https://www.npmjs.com/package/typescript-collections ) 中定义的集合似乎不起作用。它抛出一个错误，提示“'collection' 的值是不可重复的。”

Answer 1

您几乎可以使用 aurelia 迭代任何对象/数组/集合/映射。

数组:

<template>
    <p repeat.for="friend of friends">Hello, ${friend}!</p>
</template>

范围:

<template>
    <p repeat.for="i of 10">${10-i}</p>
    <p>Blast off!</p>
</template>

设置:

<template>
    <p repeat.for="friend of friends">Hello, ${friend}!</p>
</template>

export class RepeaterTemplate {
    constructor() {
        this.friends = new Set();
        this.friends.add('Alice');
        this.friends.add('Bob');
        this.friends.add('Carol');
        this.friends.add('Dana');
     }
}

map :

<template>
  <p repeat.for="[greeting, friend] of friends">${greeting}, ${friend.name}!</p>
</template>

export class RepeaterTemplate {
  constructor() {
    this.friends = new Map();
    this.friends.set('Hello',
      { name : 'Alice' });
    this.friends.set('Hola',
      { name : 'Bob' });
    this.friends.set('Ni Hao',
      { name : 'Carol' });
    this.friends.set('Molo',
      { name : 'Dana' });
  }
}

对象:

<template>
  <p repeat.for="greeting of friends | keys">${greeting}, ${friends[greeting].name}!</p>
</template>

export class RepeaterTemplate {
    constructor() {
      this.friends = {
        'Hello': { name : 'Alice' },
        'Hola':  { name : 'Bob' },
        'Ni Hao': { name : 'Carol' },
        'Molo': { name : 'Dana' }
       }
   }
}
export class KeysValueConverter {
  toView(obj) {
    return Reflect.ownKeys(obj);
  }
}

请引用:Aurelia Repeaters