Tìm kiếm trang web

angular - Làm thế nào để triển khai hàm sleep trong TypeScript?

Tôi đang phát triển một trang web bằng Angular 2 sử dụng TypeScript và tôi đang tự hỏi liệu có cách nào để triển khai chức năng thread.sleep(ms) không.

Trường hợp sử dụng của tôi là chuyển hướng người dùng sau khi gửi biểu mẫu sau vài giây, điều này rất dễ trong JavaScript nhưng tôi không chắc cách thực hiện trong TypeScript.

Câu trả lời #1

Bạn phải chờ TypeScript 2.0 với async/await để hỗ trợ ES5 vì bây giờ nó chỉ được hỗ trợ cho biên dịch TS sang ES6.

Bạn sẽ có thể tạo hàm trễ với async:

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

Và gọi nó là

await delay(1000);

Nhân tiện, bạn có thể chờ trực tiếp trên Promise:

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

Xin lưu ý, bạn chỉ có thể sử dụng await bên trong hàm async.

Nếu bạn không thể (giả sử bạn đang xây dựng ứng dụng nodejs), chỉ cần đặt mã của bạn vào hàm async ẩn danh. Đây là một ví dụ:

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

        await delay(1000);

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

Ví dụ về ứng dụng TS: https://github.com/v-andrew/ts-template

Trong JS CŨ bạn phải sử dụng

setTimeout(YourFunctionName, Milliseconds);

hoặc

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

Tuy nhiên, với việc mọi trình duyệt lớn đều hỗ trợ async/await, nó trở nên kém hữu ích hơn.

Cập nhật: TypeScript 2.1 đã ra mắt với async/await.

Chỉ cần đừng quên rằng bạn cần triển khai Promise khi biên dịch sang ES5, nơi Promise không có sẵn một cách tự nhiên.

PS

Bạn phải xuất hàm nếu muốn sử dụng nó bên ngoài tệp gốc.

Câu trả lời #2

Điều này có hiệu quả: (cảm ơn các bình luận)

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

Câu trả lời #3

Vì một lý do nào đó, câu trả lời được chấp nhận ở trên không hoạt động trong các phiên bản mới của Angular (V6).

cho việc đó hãy sử dụng cái này..

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

trên đã hiệu quả với tôi.

Cách sử dụng :

this.delay(3000);

HOẶC cách chính xác hơn

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

Câu trả lời số 4

Với RxJS:

import { timer } from 'rxjs';

// ...

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

x là 0.

Nếu bạn cung cấp một đối số thứ hai period cho timer, một số mới sẽ được phát ra mỗi period mili giây (x=0 rồi x=1, x=2, ...).

Xem tài liệu chính thức để biết thêm chi tiết.

Câu trả lời số 5

Hoặc thay vì khai báo một hàm, chỉ cần:

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

Câu trả lời số 6

import { timer } from 'rxjs';
import { take } from 'rxjs/operators';

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

cái này phù hợp với tôi hơn

Câu trả lời số 7

Cách đúng để làm điều đó từ ES6 là

import { setTimeout } from 'timers/promises';

await setTimeout(5000);

Nó là phương thức Node gốc bây giờ. https://nodejs.org/api/timers.html

Bài viết liên quan