Question

我正在寻找一种在角度组件上填充数据的方法。我必须在单个组件中加载多个下拉菜单的数据。因此最好是按需加载值，或者在绘制组件时首先加载它们。还是有其他方法可以做到这一点，以便向用户展示渲染组件和数据的最小延迟。

先谢谢了。

ngOnInit() { 
      this.loadAvalues();
      this.loadBvalues();
      this.loadCvalues();
      this.loadDvalues();
      this.loadEvalues();
      this.loadFvalues();
}

或

在触发操作时调用这些方法。

Answer 1

用于创建渲染数据的本地“缓存”；它在某种程度上取决于您要加载多少数据以及数据显示为什么。当您执行fetch时，它是异步的，但是在每次更改模型后都会重新渲染。如果有问题，可以将它们全部包裹在Promise.all([this.loadAValues ... ])中。

由于它是一个下拉列表，因此不希望有任何加载时间，因此，请务必先加载。但是，并不需要立即获取数据，因此可以在完成任何交互后加载一些数据。

Answer 2

您应该在OnInit上触发调用。由于这些是独立的调用，因此不会阻止UI呈现。

您可以禁用下拉菜单，直到数据加载，或显示一些类似于下拉菜单的加载消息，一旦数据到来，则使用实际数据呈现下拉菜单。

如果在单击下拉菜单时将其打开，则会向用户显示一些延迟，这可能不是良好的用户体验。

即使您缓存结果，第一次打开每个下拉菜单时，用户也需要等待每个下拉菜单的数据，但是，如果它们是独立的，则有可能在用户打开第一个下拉菜单时，其他时间呼叫得到解决，您的数据就会填充。

如何有效地将所需的值从数据库加载到角度组件？

2 个答案: