物品在~10秒后消失[Angular2，* ngFor]

Question

我有一个简单的Angular2模板，如下所示：

<span *ngFor="let message of messages">
  {{ message.content }}
</span>

背后的相应TS逻辑：

let a = new Map();
for(let i = 0; i < 100; i++) {
  a.set(i, { content: i.toString() });
}

this.messages = a.values();

我可以在视图中看到100个项目的列表，但几秒钟后（从5到15秒），它们会消失，没有任何错误/警告。

为什么会这样？

Answer 1

实际上，您没有收到任何可见的更改，因为在for循环完成对map变量的迭代之前，您要将空（在那一刻）map元素分配给messages变量。

可能的解决方案是添加setTimeout函数来等待循环完成。

setTimeout(() => {
  this.messages = a.values();
}, 200);

<强> Plunker link

注意：各位程序员，我们这里有一点问题，a.values()函数怎么可能不等待循环结束？它表现得像一个异步电话......我能够用setTimeout修复它，但从长远来看它没有效果。

任何人都知道为什么会这样工作？