javascript - $resource `get` 函数如何在 AngularJS 中同步工作？

Question

我在看this AngularJS 教程描述了如何使用 Angular 资源连接到 Twitter。 ( Video tutorial ) 这是在示例 Controller 中设置的资源:

$scope.twitter = $resource('http://twitter.com/:action',
    {action: 'search.json', q: 'angularjs', callback: 'JSON_CALLBACK'},
    {get: {method: 'JSONP'}});

本教程显示有几种方法可以使用 get 调用从资源中取回数据。第一种方法是将回调传递给 get 函数。 ajax 请求返回后会调用回调函数:

$scope.twitter.get(function(result) {
    console.log('This was the result:', result);
});

我理解这个方法。这对我来说很有意义。资源表示 Web 上可以获取数据的位置，get 只是对 url 进行 ajax 调用，获取 json，并使用 json 调用回调函数。 result 参数是那个 json。

这对我来说很有意义，因为很明显这是一个异步调用。也就是说，在幕后，ajax 调用会触发，调用后的代码不会被阻塞，它会继续执行。然后在稍后的某个不确定点，当 xhr 成功时，回调函数被调用。

然后教程展示了一个不同的方法，看起来简单很多，但我不明白它是如何工作的:

$scope.twitterResult = $scope.twitter.get();

我假设 get 下的 xhr 必须是异步的，但在这一行中，我们将 get 调用的返回值分配给一个变量，就好像它返回了同步。

是不是我没看懂？这怎么可能？我认为它真的很好用，我只是不明白。

我知道 get 可以返回 something 而它下面的 xhr 关闭并异步处理，但是如果你自己按照代码示例，你会看到 $scope.twitterResult 在执行任何后续行之前获取实际的推特内容。例如，如果您在该行之后立即编写 console.log($scope.twitterResult)，您将看到来自 twitter 的结果记录在控制台中，而不是稍后替换的临时值。

更重要的是，因为这是可能的，我该如何编写一个利用相同功能的 Angular 服务？除了 ajax 请求之外，还有其他类型的数据存储需要可以在 JavaScript 中使用的异步调用，我希望能够以这种方式同步编写代码。例如，索引数据库。如果我能全神贯注于 Angular 的内置资源是如何做到这一点的，我会试一试。

Answer 1

$resource 不是同步的，尽管这个语法可能表明它是:

$scope.twitterResult = $scope.twitter.get();

这里发生的事情是，在调用 twitter.get() 之后，对 AngularJS 的调用将立即返回，结果是一个空数组。然后，当异步调用完成并且真正的数据从服务器到达时，数组将更新为数据。 AngularJS 将简单地保留对返回数组的引用，并在数据可用时填充它。

这是 $resource 实现的片段，其中发生了“魔法”:https://github.com/angular/angular.js/blob/master/src/ngResource/resource.js#L372

这在 $resource documentation 中有描述还有:

It is important to realize that invoking a $resource object method immediately returns an empty reference (object or array depending on isArray). Once the data is returned from the server the existing reference is populated with the actual data. This is a useful trick since usually the resource is assigned to a model which is then rendered by the view. Having an empty object results in no rendering, once the data arrives from the server then the object is populated with the data and the view automatically re-renders itself showing the new data. This means that in most case one never has to write a callback function for the action methods.