Question

所以我一直在尝试将我的应用程序转换为通用的角度，并且在大多数情况下都很好。但是我之前读过一些“陷阱”：https://github.com/onespeed-articles/angular-universal-gotchas

这表明我不应该使用烦人的[ { "url": "https://web.tmxmoney.com/quote.php?qm_symbol=ACB&locale=EN", "Volume": "Volume:\n12,915,903", "Price": "$ 7.67", "Name": "Aurora Cannabis Inc." }, { "url": "https://web.tmxmoney.com/quote.php?qm_symbol=HNL&locale=EN", "Volume": "Volume:\n548,038", "Price": "$ 1.60", "Name": "Horizon North Logistics Inc." }, { "url": "https://web.tmxmoney.com/quote.php?qm_symbol=ACB&locale=EN", "Volume": "Volume:\n12,915,903", "Price": "$ 7.67", "Name": "Aurora Cannabis Inc." } ]，因为在 angularjs 中，您使用它在渲染视图后使事物点火，因此您可以确定元素是正确的，等等。

我还读到它仍然存在于角度6 中，所以我有以下指令：

timeout

浏览器调整大小时，它将等待0.5秒，然后再尝试调整按钮组的大小。如果这是不好的做法，那我应该怎么用呢？

Answer 1

浏览器调整大小时，它将等待0.5秒，然后再尝试调整按钮组的大小。如果这是不好的做法，那我应该怎么用呢？

您正在延迟每个调整大小事件。通常，您希望每500ms去抖动和处理一次事件。可以使用可观察的方法完成此操作，但是请确保在组件被破坏时取消订阅。

observableFromEvent(window, 'resize')
  .pipe(debounceTime(500))
  .subscribe(() => this.resize(this.element, this.className))

@HostListener()也永远不会在服务器端渲染期间触发事件。服务器上没有DOM来触发窗口调整大小事件。

  setTimeout(function () {
      resize(element, className);
  }, 500);

您在此处使用的setTimeout全局函数在NodeJS中具有不同的函数签名。当您在Angular Universe中运行该应用程序时，它将在NodeJS内运行以生成HTML，然后再将其发送到Web浏览器。 setTimeout在Web浏览器上返回一个数字，但在NodeJS中返回一个资源句柄。

如果要在Angular Universal中运行应用程序，则意味着您正在编写与Web浏览器分离的源代码。这意味着没有对DOM的直接操作，没有全局变量，也没有全局 window 变量。

Answer 2

您希望该代码在浏览器而非服务器中运行。您提供的链接为您提供了解决方案：

all(array[])

Angular Universal-不应使用超时

2 个答案: