来自数据库的数据未使用angular加载到页面加载的变量

Question

在页面加载时，我从数据库获取数据并将其放在$scope.x中。在我的网络选项卡中，我从我的数据库中获取列表，但它没有加载到变量中，我将很快需要在下拉列表中使用ng-repeat。但是，在页面加载之后，当我单击一个检索数据并将其放在$scope.x中的按钮时，我已经获得了值。如果我这样做，我没有得到页面加载的值，只需单击检索变量数据的按钮，我也没有得到任何东西。我究竟做错了什么。以下是我的代码：

$scope.addProject = function () {
    debugger;
    console.log($scope.clientList);
    console.log($scope.userList);
};

$scope.getClients = function () {
    debugger;
    $http.get('/Clients/GetClients')
        .then(function (response) {
            $scope.clientList = response.data;
        });
};

$scope.getAllUsers = function () {
    debugger;
    $http.get('/User/GetAllUsers')
        .then(function (response) {
            $scope.userList = response.data;
        })
};

$scope.getClients();
$scope.getAllUsers();
$scope.addProject();

Answer 1

在从服务器返回数据之前调用addProject函数。

修改getClients和getAllUsers函数以返回promise：

$scope.addProject = function () {
    debugger;
    console.log($scope.clientList);
    console.log($scope.userList);
};

$scope.getClients = function () {
    debugger;
    ̲r̲e̲t̲u̲r̲n̲ $http.get('/Clients/GetClients')
        .then(function (response) {
            $scope.clientList = response.data;
        });
};

$scope.getAllUsers = function () {
    debugger;
    ̲r̲e̲t̲u̲r̲n̲ $http.get('/User/GetAllUsers')
        .then(function (response) {
            $scope.userList = response.data;
        })
};

然后使用$q.all等待承诺：

var clientsPromise = $scope.getClients();
var allUsersPromise = $scope.getAllUsers();

$q.all([clientsPromise, allUsersPromise])
  .then(function() {
    $scope.addProject();
});

Answer 2

你应该得到这样的数据

var getclients= function(){

    debugger;
    console.log($scope.clientList);
    console.log($scope.userList);
};


getclients();