微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

angular – 为返回promise的javascript方法添加延迟

我目前正在尝试学习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',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);
    }
}

开发人员工具App

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

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

getExampleData() {
    setTimeout(() => (): Promise<Array<any>> => {
        return this.developerService.getExampleData();
    },3000);
}
延迟原生承诺

未定义解决的新承诺

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库具有更好的性能和方便的功能,可以立即使用,以延迟承诺链.

未定义解决的新承诺

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运算符创建或转换promise,并且开销很小.

未定义解决的新承诺

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();

原文地址:https://www.jb51.cc/angularjs/141717.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐