在Angularjs运行块中等待异步javascript答案

【问题标题】：Await async javascript in Angularjs run block在Angularjs运行块中等待异步javascript
【发布时间】：2018-09-14 13:13:08
【问题描述】：

我正在运行一些初始化代码以在 run() 块中填充我的初始应用程序状态。初始应用程序状态需要一个 HTTP 调用来获取一些数据来填充状态，但是，运行块在 HTTP 承诺解决之前执行并引导应用程序，因此我的初始页面状态在页面显示时实际上并没有填充。

如何在启动应用程序之前“等待”状态初始化？

const Run = (StoreService, ContentService) => {
  'ngInject';

  let appState = StoreService.getState();
  // Initialise Application State
  if (!appState) {

    const initialState = {
      $valid: {},
      labels: []
    };    
    
    // THIS METHOD NEEDS TO RESOLVE BEFORE THE APPLICATION IS BOOTSTRAPPED
    ContentService.getAllContent()
      .then(data => {
        StoreService.setState({
          ...initialState,
          labels: data
        });
        console.log('Content Saved');
      })
      .catch(err => {
        console.log(err);
      });    
  }
  
angular.module('app').run(Run);

angular.bootstrap(document.getElementById('app'), ['app'], {
  strictDi: true
});

【问题讨论】：

请准确解释你想要什么。如果在任何角度 (medium.com/@thatisuday/…) 之前运行 http，或者您很乐意在调用之前初始化服务，但您希望在控制器初始化之前调用 http？
后者。我需要在主控制器运行之前初始化状态，以便控制器中可以使用完整的状态。
我个人更喜欢创建路由状态，任何其他状态都可以扩展并调用它们 - 这样我就可以完全控制，即可以在请求进行时显示一些漂亮的加载。
你有一个例子说明你是如何做到的吗？

标签： javascript angularjs asynchronous promise

【解决方案1】：

您只需将await 放在您想要等待的承诺（或返回承诺的语句）前面。请记住，当您执行此操作时，您的程序可能会执行其他操作。此外，您还必须等待需要等待的所有内容，包括 http 调用。更多信息here

在您的情况下，您可能需要处理

ContentService.getAllContent()
      .then(data => {
        StoreService.setState({
          ...initialState,
          labels: data
        });
        console.log('Content Saved');
      })
      .catch(err => {
        console.log(err);
      });

不同。您可以等待它而不是 .then()，因为它在解析时返回一个值，您可以将 data 变量赋值放在前面。然后在后面写逻辑。

try {
    const data = await ContentService.getAllContent();
    StoreService.setState({
        ...initialState,
        labels: data
    });
    console.log('Content Saved');
} catch (err) {
    console.log(err);
}

您可能还必须使 Run 异步，因此您还需要等待。

const Run = async (StoreService, ContentService) => ...

angular.module('app').run(await Run);

更多信息等待here

【讨论】：