添加延迟到返回promise的javascript方法

Question

我目前正在尝试学习Angular 2，打字稿，承诺等。我为开发人员工具和只返回硬编码数据的服务设置了一个小应用程序。这仅用于测试目的。

我想在服务方法上添加短暂超时来模拟服务器滞后以测试我的一些控件，但是我找不到正确的语法来执行此操作。如何在服务电话中添加5秒延迟？

开发人员工具服务

@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);
    }
}

开发人员工具应用

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

更新：1 我已经尝试将setTimeout（）添加到我试图实现的控件调用中，但它从不填充该点的数据。我真的很想延迟服务调用方法，所以我不必记得重复实现它。

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

Answer 1

延迟原生承诺

使用undefined

解决的新承诺

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

使用值

解析的新承诺

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

现有承诺

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

延迟蓝鸟承诺

Bluebird promise库具有更好的性能和方便的功能，可以立即使用，以延迟承诺链。

使用undefined

解决的新承诺

return Bluebird.delay(5000);

使用值

解析的新承诺

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

现有承诺

return bluebirdPromise.delay(5000);

使用RxJS延迟承诺

RxJS已经在Angular 2/4项目中使用，可用于使用RxJS运算符创建或转换承诺，并且开销很小。

使用undefined

解决的新承诺

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

使用值

解析的新承诺

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

现有承诺

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

Answer 2

RxJS 6的延迟结果

您可以使用以下代码将RxJs 6中的值延迟n毫秒。

没有特定值（将发出0）

return timer(n);

具有设定值

return of(value).pipe(delay(n));

或

return timer(n).pipe(mapTo(value));

来自诺言

return from(promise).pipe(delay(n));

返回承诺

在.toPromise()之后的 之前的任何示例中放置pipe。

return timer(n).toPromise();

return of(value).pipe(delay(n)).toPromise();

等