Question

以下是Angular.io的Tour of Heros教程的代码片段：

getHeroesSlowly(): Promise<Hero[]> {
  return new Promise(resolve => {
     // Simulate server latency with 2 second delay
    setTimeout(() => resolve(this.getHeroes()), 2000);
  });
}

描述说明：要模拟慢速连接，请导入Hero符号并将以下getHeroesSlowly（）方法添加到HeroService。

我了解最佳做法是基于慢速连接构建网站，其中有两个例子是here和here。

但是为什么我会设置一个计时器来测试构建（就像Angular建议的那样）而不是限制连接（比如在Chrome中）？

Answer 1

正如您所引用的，这只是与API连接速度缓慢的基本示例，因此您可以看到加载数据。如你所说，限制连接（在Chrome中）不会模拟API与客户端之间的连接延迟，这会降低整个网页的速度。

更有趣的是同时使用这两种技巧。

Answer 2

在您的示例中，setTimeout用于在两秒钟内模拟服务器响应。它并不一定意味着它模拟慢速连接。由于各种原因，响应可以在两秒内完成，一个是服务器需要2秒才能完成它的工作。但是，正如您所注意到的，这不是生产代码，而是用于演示框架的特定功能。

生产代码中setTimeout最常见的用途是允许Angular在您以其他方式同步执行的操作之间运行一次更改检测。在文章Everything you need to know about the ExpressionChangedAfterItHasBeenCheckedError error中，建议将此方法作为错误的可能解决方案。

Answer 3

我认为这是因为它实际上没有击中服务器。我认为getHeros方法只是返回硬编码数据。他们试图演示如何使用Promises Angular样式并让它在返回之前等待几秒钟，以帮助您了解在实际拥有数据之前如何处理状态。即。检查以确保在迭代列表之前填充列表。

Angular中setTimeout的目的是什么？

3 个答案: