角度承诺：拦截“然后”答案

【问题标题】：Angular promise: intercept "then"角度承诺：拦截“然后”
【发布时间】：2014-05-19 20:03:08
【问题描述】：

现在我有一个名为 chartModelService 的 Angular 服务，上面有这个方法：

this.fetchChartModel = function() {
    return $http.get(fullUrlPath);
};

我有一个使用这些数据的 Angular 控制器：

chartModelService.fetchChartModel().then(function(rawData) {
    var chartData = chartModelService.translate(rawData);
    $scope.populateChart(chartData);
});

我想在chartModelService 中执行chartModelService.translate(data)，而不是使用该服务的控制器。换句话说，我想把控制器改成下面的代码，它接收到的chartData已经被翻译了：

chartModelService.fetchChartModel().then(function(chartData) {
    $scope.populateChart(chartData);
});

如何更改chartModelService.fetchChartModel()，使其在返回承诺的数据之前执行translate()？

【问题讨论】：

标签： javascript angularjs angular-promise

【解决方案1】：

改变这个：

this.fetchChartModel = function() {
    return $http.get(fullUrlPath);
};

到这里：

this.fetchChartModel = function() {
    var defObj = $q.defer();

    var fetch = $http.get(fullUrlPath);
    fetch.then(function(data){
        defObj.resolve(chartModelService.translate(data));
    });

    return defObj.promise;
};

（当然，在您的服务上使用适当的 DI）

这将初始化数据获取并在完成后返回一个包含已翻译数据的承诺。

【讨论】：

【解决方案2】：

只需移动您的代码；）

this.fetchChartModel = function() {
    return $http.get(fullUrlPath)
    .then(function(rawData) {
        return $q.resolve(chartModelService.translate(rawData);)
    });
};

应该确保你在依赖项中包含 $q 服务

【讨论】：

【解决方案3】：

对我来说 $q.resolve 不起作用，但你可以改用 $q.when

this.fetchChartModel = function() {
    return $http.get(fullUrlPath)
    .then(function(rawData) {
        return $q.when(chartModelService.translate(rawData));
    });
};

【讨论】：