javascript - AngularJs 如何确保代码同步执行

Question

我在页面上有一个按钮，可以调用 Controller 内的流程函数，但在发布详细信息之前，我需要获取用户详细信息和用户组详细信息，最后发布用户详细信息。

但是当我调试这个时，我可以看到我的 populateUserGroups 函数被调用，但没有获取详细信息， updateUser 函数被调用，因此发布的数据没有 userGroup 数据。

似乎populateUserGroups函数是异步调用的，我如何确保当用户单击“进程”按钮时，首先调用getData，然后调用 populateUserGroups 并用返回的数据填充 $scope.user.userGroups ，最后调用 updateUser ？

    $scope.process = function () {
        myservice.getData($scope.userId).success(function (data) {

                $scope.user = data.value;
                $scope.user.userGroups = {};

                $scope.populateUserGroups();
                $scope.updateUser();

        });
    };

    $scope.populateUserGroups = function () {
        myservice.getUserGroups($scope.userId).success(function (groupData) {
            $scope.user.userGroups = groupData;
        });
    };

    $scope.updateUser = function() {
        myservice.updateUser($scope.user).success(function () {

            // do stuff

        });
    };  

Answer 1

使用$q.all

$q.all([
  myservice.getData($scope.userId),
  myservice.getUserGroups($scope.userId)
]).then(function(resps){
  $scope.user = resps[0].value;
  $scope.user.userGroups = resps[1].data;

  $scope.populateUserGroups();
  $scope.updateUser();
})