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

Question

Aurelia文档指出,我们可以使用带有数组和其他可迭代数据类型(包括对象)的转发器,以及Map和Set等新的ES6标准.映射是重复的推荐方式.例如,如下所示:

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

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

迭代typescript-collections包(https://www.npmjs.com/package/typescript-collections)中定义的集合似乎不起作用.它引发了一个错误,抱怨"收集价值'是不可重复的."

Answer 1

你可以使用aurelia迭代任何对象/数组/ set/map.

数组:

<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');
     }
}

地图:

<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