Question

Aurelia文档指出，我们可以使用带阵列的转发器和其他可迭代数据类型，包括对象，以及新的ES6标准，如Map和Set。地图是推荐的重复方式，例如下面的例子：

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

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

迭代typescript-collections包（https://www.npmjs.com/package/typescript-collections）中定义的集合似乎不起作用。它会引发一个错误，抱怨＆＃34;收集价值＆＃39;是不可重复的。＆＃34;

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

图：

<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

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

1 个答案: