在用返回的数据填充变量之前，如何使用 promise 导致函数等待？

Question

我有一个返回股票报价数据的 API，我的问题是模型变量在 return_array 有数据之前首先返回 undefined。

我不确定如何使用 promises 或其他方法在填充变量之前正确等待数据（除了使用可怕的$timeout hack）。

---

您可以在 chrome 检查器中看到我的问题 (ticker_chart = undefined)：

我需要ticker_chart 等待，然后才能获得值。

---

第一个调用服务以返回报价数据的函数：

function renderChart(ticker, limit) {
    ticker_chart = TickerChartFactory.returnTickerChartData(ticker, limit);
    console.log('ticker_chart = ',ticker_chart);
}

完整的服务功能：

function returnTickerChartData(ticker, limit) {

    var q = $q.defer();

    var get_data = '';
    if (limit > 0) {
        get_data = '?limit=' + limit;
    }

    ApiFactory.getTickerQuotes(ticker.ticker).success(
        function(data, status, headers, config) {
            if (data.status == 'Success') {
                console.log('REST GET Ticker Chart', 'success');
                var data_array = [];

                for (var i=0; i<data.quotes.length; i++) {
                    data_array.push([data.quotes[i].start_epoch, data.quotes[i].price]);
                }

                var return_array = [{
                    "area": true,
                    "key": "Price",
                    "color": '#BFBFBF',
                    "values": data_array
                }];

                console.log('return_array = ',return_array);
                console.log('q =',q);
                q.resolve(return_array);
                return ticker_chart = return_array;

            } else {
                console.log('failed to REST GET Ticker Chart');
                q.reject('failed to REST GET Ticker Chart');
                return ticker_chart = 'failed to REST GET Ticker Chart';
            }
        }).error(function(data, status) {
            console.log('error in getting REST GET Ticker Chart');
            q.reject('error in getting REST GET Ticker Chart');
            return ticker_chart = 'error in getting REST GET Ticker Chart';
        });
}

ApiFactory 中的getTickerQuotes 函数：

function getTickerQuotes(ticker) {
    return $http.get('https://www.ourapi.../api/tickers/quotes/'+ticker, {cache: false});
}

我应该如何在这里使用承诺？我唯一能想到的另一件事是使用 $scope.watch 函数等待ticker_chart 的值发生变化，然后再尝试渲染。

Answer 1

您正在returnTickerChartData 中创建承诺，但我看不到您会返回它。您需要将其更改为

function returnTickerChartData(ticker, limit) {
    var q = $q.defer();
    // API call

    return q.promise;
}

在getTickerQuotes.success 中，您只需要使用数据来解决承诺。您不需要return ticker_chart = return_array; 行。 然后，

function renderChart(ticker, limit) {
    TickerChartFactory.returnTickerChartData(ticker, limit)
        .then(function (result) {
            ticker_chart = result;
            console.log('ticker_chart = ', ticker_chart);
        });
}

编辑：@Bergi 在 cmets 中提出了一个有效点。如果ApiFactory.getTickerQuotes 已经返回了一个promise，你应该返回它而不是创建一个带有deferred 的新promise。也改为使用ApiFactory.getTickerQuotes.then() 而不是.success()。