angular - Cum să implementezi o funcție sleep în TypeScript?

Dezvolt un site web în Angular 2 folosind TypeScript și mă întrebam dacă există o modalitate de a implementa funcționalitatea thread.sleep(ms).

Cazul meu de utilizare este să redirecționez utilizatorii după ce trimit un formular după câteva secunde, ceea ce este foarte ușor în JavaScript, dar nu sunt sigur cum să fac asta în TypeScript.

Răspuns #1

Trebuie să aștepți TypeScript 2.0 cu async/await pentru suport ES5, deoarece acum este suportat doar pentru compilarea din TS în ES6.

Ai putea crea o funcție de întârziere cu async:

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

Și numește-l

await delay(1000);

Apropo, poți să aștepți direct pe Promise:

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

Vă rugăm să rețineți că puteți folosi await doar în interiorul unei funcții async.

Dacă nu poți (să zicem că dezvolți o aplicație nodejs), pur și simplu plasează codul tău în funcția anonimă async. Iată un exemplu:

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

        await delay(1000);

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

Exemplu de aplicație TS: https://github.com/v-andrew/ts-template

În JS VECHE trebuie să folosești

setTimeout(YourFunctionName, Milliseconds);

sau

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

Totuși, cu fiecare browser major care suportă async/await, este mai puțin util.

Actualizare: TypeScript 2.1 este aici cu async/await.

Doar să nu uiți că ai nevoie de implementarea Promise atunci când compilezi în ES5, unde Promise nu este disponibil nativ.

P.S.

Trebuie să exporți funcția dacă vrei să o folosești în afara fișierului original.

Răspunsul #2

Funcționează: (mulțumesc pentru comentarii)

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

Răspunsul #3

Din anumite motive, răspunsul acceptat de mai sus nu funcționează în noile versiuni de Angular (V6).

pentru asta folosește asta..

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

ceea ce este de mai sus a funcționat pentru mine.

Utilizare :

this.delay(3000);

SAU mod mai precis

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

Răspunsul #4

Cu RxJS:

import { timer } from 'rxjs';

// ...

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

x este 0.

Dacă oferiți un al doilea argument period funcției timer, un număr nou va fi emis la fiecare period milisecunde (x=0 apoi x=1, x=2, ...).

Consultă documentația oficială pentru mai multe detalii.

Răspuns #5

Sau mai degrabă decât să declari o funcție, pur și simplu:

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

Răspunsul #6

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

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

asta funcționează mai bine pentru mine

Răspuns #7

Modul corect de a face acest lucru din ES6 este

import { setTimeout } from 'timers/promises';

await setTimeout(5000);

Acum este metoda nativă Node. https://nodejs.org/api/timers.html