Angular 2在列表上循环有些延迟 [英] Angular 2 loop through a list with some delay
本文介绍了Angular 2在列表上循环有些延迟的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何使用Angular 2和TypeScript延迟循环遍历数组?
How do I loop through an array with some delay with Angular 2 and TypeScript?
我有一个数组
students: Array<any> = [
{
name: "Alan"
},
{
name: "Jake"
},
{
name: "Harry"
},
{
name: "Susan"
},
{
name: "Sarah"
},
{
name: "Esther"
}
];
我想遍历列表并以2000ms
延迟显示名称.
I want to loop through the list and display the names with a 2000ms
delay.
<div *ngFor="let student of students">
{{student.name}}
</div>
没有延迟,而是一次循环.
doesn't work with a delay but is looping all at once.
推荐答案
只需使用setTimeout
.例如(*未经测试):
Just use setTimeout
. For example (* not tested):
students: Array<any> = [ ];
populateArrayWithDelay():void{
let people = [
{
name: "Alan"
},
{
name: "Jake"
},
{
name: "Harry"
},
{
name: "Susan"
},
{
name: "Sarah"
},
{
name: "Esther"
}
];
for(let i = 0; i < people.length; i++){
let student = people[i];
setTimeout(() => {
this.students.push(student);
}, 2000*(i+1));
}
}
这篇关于Angular 2在列表上循环有些延迟的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文