angular - Hvordan implementere en søvnfunksjon i TypeScript?

Jeg utvikler et nettsted i Angular 2 ved hjelp av TypeScript, og jeg lurte på om det finnes en måte å implementere thread.sleep(ms)-funksjonalitet på.

Mitt bruksområde er å omdirigere brukerne etter å ha sendt inn et skjema etter noen sekunder, noe som er veldig enkelt i JavaScript, men jeg er ikke sikker på hvordan jeg gjør det i TypeScript.

Svar #1

Du må vente på TypeScript 2.0 med async/await for ES5-støtte, da det nå bare støttes for TS til ES6-kompilering.

Du vil kunne lage en forsinkelsesfunksjon med async:

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

Og kall det

await delay(1000);

Forresten, du kan vente på Promise direkte:

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

Vennligst merk at du kun kan bruke await inne i en async-funksjon.

Hvis du ikke kan (la oss si at du bygger en Node.js-applikasjon), plasser bare koden din i den anonyme async-funksjonen. Her er et eksempel:

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

        await delay(1000);

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

Eksempel TS-applikasjon: https://github.com/v-andrew/ts-template

I GAMMEL JS må du bruke

setTimeout(YourFunctionName, Milliseconds);

eller

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

Men med at alle større nettlesere støtter async/await er det mindre nyttig.

Oppdatering: TypeScript 2.1 er her med async/await.

Bare ikke glem at du trenger Promise-implementering når du kompilerer til ES5, hvor Promise ikke er tilgjengelig nativt.

PS

Du må eksportere funksjonen hvis du vil bruke den utenfor den opprinnelige filen.

Svar #2

Dette fungerer: (takk til kommentarene)

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

Svar #3

Av en eller annen grunn fungerer ikke det ovennevnte aksepterte svaret i nye versjoner av Angular (V6).

for det, bruk dette..

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

ovenfor fungerte for meg.

Bruk:

this.delay(3000);

ELLER mer nøyaktig måte

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

Svar #4

Med RxJS:

import { timer } from 'rxjs';

// ...

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

x er 0.

Hvis du gir et andre argument period til timer, vil et nytt tall bli sendt ut hvert period millisekund (x=0, deretter x=1, x=2, ...).

Se den offisielle dokumentasjonen for flere detaljer.

Svar #5

Eller i stedet for å erklære en funksjon, ganske enkelt:

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

Svar #6

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

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

dette fungerer bedre for meg

Svar #7

Den riktige måten å gjøre det på fra ES6 er

import { setTimeout } from 'timers/promises';

await setTimeout(5000);

Det er den native Node-metoden nå. https://nodejs.org/api/timers.html

Relaterte artikler