如何在TypeScript中实现睡眠函数?

我正在使用TypeScript在Angular 2中开发一个网站,我想知道是否有一种方法来实现thread.sleep(ms)功能。

我的用例是在几秒钟后提交表单后重定向用户,这在JavaScript中非常容易,但我不确定如何在TypeScript中做到这一点。

564012 次浏览

这是有效的:(感谢评论)

setTimeout(() =>
{
this.router.navigate(['/']);
},
5000);

你必须等待带有async/await的TypeScript 2.0才能获得ES5支持,因为它现在只支持TS到ES6的编译。

你可以用async创建延迟函数:

function delay(ms: number) {
return new Promise( resolve => setTimeout(resolve, ms) );
}

并称之为

await delay(1000);

顺便说一句,你可以直接等待Promise:

await new Promise(f => setTimeout(f, 1000));

请注意,你只能在async函数中使用await

如果不能(假设你正在构建nodejs应用程序),只需将代码放在匿名async函数中。这里有一个例子:

    (async () => {
// Do something before delay
console.log('before delay')


await delay(1000);


// Do something after
console.log('after delay')
})();

示例TS应用:https://github.com/v-andrew/ts-template

在OLD JS中你必须使用

setTimeout(YourFunctionName, Milliseconds);

setTimeout( () => { /*Your Code*/ }, Milliseconds );

然而,由于每个主流浏览器都支持async/await,所以它就不那么有用了。

< p >更新: TypeScript 2.1在这里带有async/await.

不要忘记,当你编译到ES5时,你需要Promise实现,在ES5中Promise不是本机可用的。

PS

如果你想在原始文件之外使用它,你必须导出函数

出于某种原因,上述接受的答案在Angular (V6)的新版本中不起作用。

为此使用这个..

async delay(ms: number) {
await new Promise(resolve => setTimeout(()=>resolve(), ms)).then(()=>console.log("fired"));
}

以上对我来说很管用。

用法:

this.delay(3000);

或者更准确的说法

this.delay(3000).then(any=>{
//your task after delay.
});

如果你正在使用angar5及以上版本,请在你的ts文件中包含下面的方法。

async delay(ms: number) {
await new Promise(resolve => setTimeout(()=>resolve(), ms)).then(()=>console.log("fired"));
}

然后在任何需要的地方调用delay()方法。

例句:

validateInputValues() {
if (null == this.id|| this.id== "") {
this.messageService.add(
{severity: 'error', summary: 'ID is Required.'});
this.delay(3000).then(any => {
this.messageService.clear();
});
}
}

这将消失的消息咆哮3秒后。

RxJS:

import { timer } from 'rxjs';


// ...


timer(your_delay_in_ms).subscribe(x => { your_action_code_here })

x是0。

如果你给第二个参数periodtimer,每period毫秒就会产生一个新的数字(x = 0然后x = 1, x = 2,…)

更多细节请参见官方文档

或者不声明一个函数,简单地说:

setTimeout(() => {
console.log('hello');
}, 1000);
import { timer } from 'rxjs';
import { take } from 'rxjs/operators';


await timer(1000).pipe(take(1)).toPromise();

这个比较适合我

你也可以使用RxJS:

import { of } from 'rxjs';
import { delay } from 'rxjs/operators';


async yourFunction() {
yourCode;
await this.delay(5000);
yourCode;
}


delay(ms: number): Promise<any> {
const dummyObservable = of();
return dummyObservable.pipe(delay(ms)).toPromise();
}