Angularjs:如何制作服务代码 "look synchronous"？

Question

如何使 Angular 服务代码“看起来同步”？

当我清理 Controller 并将业务逻辑代码放入服务中时，我的问题出现了。到目前为止，一切都很好。现在我想在服务函数中“等待”，直到所有异步调用都返回，然后然后返回。我怎样才能做到这一点？

为了说明我的问题，假设您有一个 Controller 代码:

1. 向后端请求一些数据
2. 对数据进行一些处理
3. 将数据交给范围

像这样:

重构前的DataController:

$scope.submitForm = function() {

    RestBackend.query('something').then(function(data) {

        // do some additional things ...
        ...

        $scope.data = data;
    });
};

非常简单。获取数据并填充范围。

重构为 Controller +服务后，我最终得到:

数据 Controller 重构:

$scope.submitForm = function() {

    DataService.getData().then(function(data) {
        $scope.data = data;
    });
};

数据服务重构:

this.query = function() {
    var dataDefer = $q.defer();

    RestBackend.query('something').then(function(data) {

        // do some additional things ...
        ...

        dataDefer.resolve(data);
    });
    return dataDefer.promise;
};

我不喜欢这样的事实:我还必须在 Controller 中使用 Promise。我喜欢 promise ，但我想让 Controller 不知道服务的“实现细节”。这就是我希望 Controller 代码的样子:

DataController(应该如此):

$scope.submitForm = function() {

    $scope.data = DataService.getData();
};

你明白了吗？在 Controller 中，我不想关心 promise 与否。只需等待数据被获取然后使用即可。因此，我正在寻找实现这样的服务的可能性:

1. 查询数据(异步)
2. 在获取数据之前不返回
3. 返回获取的数据

现在第 2 项我不清楚:如何“等到数据已获取”然后才继续？目标是服务功能看起来是同步的。

Answer 1

我也认为你的解决方案很好。
返回 promise 不是服务的实现细节。它是服务 API 的一部分(服务和服务使用者之间的“契约”)。

Controller 期望一个能够解析数据的 promise ，并按照它认为合适的方式进行处理。
如何构建 Promise，如何获取数据等，这些是实现细节。
您可以随时将服务更换为执行完全不同操作的服务，只要它履行契约(Contract)(即返回一个在数据准备好后即可解决的 promise )。

<小时/>

也就是说，如果您只使用 View 中的数据(即在获取数据后不直接在 Controller 中操作它)，似乎是这种情况，您可以使用 ngResources方法:

返回一个空数组并在获取数据后填充它:

$scope.data = DataService.getData();

// DataService refactored:
this.getData = function () {
    var data = [];

    RestBackend.query('something').then(function(responseData) {
        // do some additional things ...
        ...
        angular.forEach(responseData, function (item) {
            data.push(item);
        });
    });

    return data;
};

<小时/>

顺便说一句，在您当前的(精细)设置中，您需要 $q.defer() 。您可以只使用 promise 链:

this.query = function() {
    return RestBackend.query('something').then(function(data) {
        // do some additional things ...
        ...
        return data;
    });
};