นอนหลับพิมพ์

ฉันกำลังพัฒนาเว็บไซต์ใน Angular 2 โดยใช้ Typescript และฉันสงสัยว่ามีวิธีการใช้งานthread.sleep(ms)ฟังก์ชันหรือไม่

กรณีการใช้งานของฉันคือการเปลี่ยนเส้นทางผู้ใช้หลังจากส่งแบบฟอร์มหลังจากนั้นสองสามวินาทีซึ่งง่ายมากใน html หรือ javascript แต่ฉันไม่แน่ใจว่าจะทำอย่างไรใน typescript

ขอบคุณมาก,

คุณต้องรอ TypeScript 2.0 พร้อมasync/ awaitสำหรับการสนับสนุน ES5 เนื่องจากตอนนี้รองรับเฉพาะการคอมไพล์ TS to ES6

คุณจะสามารถสร้างฟังก์ชั่นการหน่วงเวลาด้วยasync:

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

และเรียกมันว่า

await delay(300);

โปรดทราบว่าคุณสามารถใช้ฟังก์ชันawaitภายในเท่านั้นasync

หากคุณไม่สามารถ ( สมมติว่าคุณกำลังสร้างแอปพลิเคชัน 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ล้าสมัยแล้ว

UPDATE: typescript 2.1 async/awaitอยู่ที่นี่กับ

อย่าลืมว่าคุณต้องPromiseติดตั้งใช้งานเมื่อคุณคอมไพล์กับ ES5 โดยที่สัญญาไม่พร้อมใช้งาน

งานนี้: (ขอบคุณความคิดเห็น)

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

ด้วยเหตุผลบางอย่างคำตอบที่ได้รับการยอมรับข้างต้นจะไม่ทำงานใน 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.
});

ด้วยRxJS:

import { timer } from 'rxjs';

// ...

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

x คือ 0

หากคุณให้อาร์กิวเมนต์ที่สองperiodกับtimerหมายเลขใหม่จะถูกปล่อยออกมาแต่ละperiodมิลลิวินาที (x = 0 แล้ว x = 1, x = 2, ... )

ดูเอกสารอย่างเป็นทางการสำหรับรายละเอียดเพิ่มเติม

หากคุณกำลังใช้ angular5 ขึ้นไปโปรดรวมวิธีการด้านล่างในไฟล์ 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 วินาที

import { timer } from 'rxjs';

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

มันใช้งานได้ดีกว่าสำหรับฉัน

หรือแทนที่จะประกาศฟังก์ชั่นเพียงแค่:

setTimeout(() => {
    console.log('hello');
}, 1000);