angular - Legg til forsinkelse i JavaScript-metode som returnerer løfte

Jeg prøver for øyeblikket å lære Angular 2, TypeScript, promises, osv. Jeg har satt opp en liten app for utviklerverktøy og en tjeneste som bare returnerer hardkodede data. Dette skal kun brukes til testformål.

Jeg ønsker å legge til en kort tidsavbrudd på servicemetoden for å simulere serverforsinkelse for testing av noen av kontrollene mine, men jeg kan ikke finne riktig syntaks for å gjøre det. Hvordan kan jeg legge til en 5 sekunders forsinkelse på servicetjenestekallet mitt?

Utviklerverktøytjeneste

@Injectable()
export class DeveloperService {
    getExampleData(): Promise<ExampleItem[]> {
        const examples: ExampleItem[] = [];
        examples.push({ id: 1, name: 'Spaceman Spiff', location: 'Outer Space', age: 12 });
        examples.push({ id: 2, name: 'Stupendous Man', location: 'The City', age: 30.5 });
        examples.push({ id: 3, name: 'Tracer Bullet', location: 'The City', age: 24 });
        examples.push({ id: 4, name: 'Napalm Man', location: 'War Zone', age: 43.333 });
        examples.push({ id: 5, name: 'Adult Calvin', location: 'In the future', age: 54 });

        // TODO: Slow down this return!
        return Promise.resolve(examples);
    }
}

Utviklerverktøy-app

getExampleData() {
    return (): Promise<Array<any>> => {
        return this.developerService.getExampleData();
    };
}

OPPDATERING: 1 Jeg har forsøkt å legge til setTimeout() i kallet for kontrollen jeg prøver å implementere, men det fyller aldri inn dataene på det tidspunktet. Jeg ønsker virkelig å få forsinkelsen inn i tjenestekallet-metoden slik at jeg slipper å huske å implementere det gjentatte ganger.

getExampleData() {
    setTimeout(() => (): Promise<Array<any>> => {
        return this.developerService.getExampleData();
    }, 3000);
}

Svar #1

Forsinket innfødt løfte

Nytt løfte som løser seg med undefined

return new Promise(resolve =>
  setTimeout(resolve, 5000)
);

Nytt løfte som løser seg med en verdi

return new Promise(resolve => 
  setTimeout(() => resolve(value), 5000)
);

Eksisterende løfte

return promise.then(value => 
  new Promise(resolve => 
    setTimeout(() => resolve(value), 5000)
  )
);

Forsinket Bluebird-løfte

Bluebird promise-biblioteket har bedre ytelse og praktiske funksjoner som kan brukes rett ut av boksen for å forsinke løftekjeder.

Nytt løfte som løser seg med undefined

return Bluebird.delay(5000);

Nytt løfte som løser seg med en verdi

return Bluebird.resolve(value).delay(5000);
// or
return Bluebird.delay(5000).return(value);

Eksisterende løfte

return bluebirdPromise.delay(5000);

Forsinket løfte med RxJS

RxJS brukes allerede i Angular 2/4-prosjekter og kan brukes til å opprette eller transformere løfter med RxJS-operatører og liten overhead.

Nytt løfte som løser seg med undefined

return Observable.of().delay(5000).toPromise();
// or
return Observable.interval(5000).first().toPromise();

Nytt løfte som løser seg med en verdi

return Observable.of(value).delay(5000).toPromise();

Eksisterende løfte

return Observable.fromPromise(promise).delay(5000).toPromise();

Relaterte artikler