数据请求有时是异步的

Question

这是我今天早些时候发布的一个问题的后续。我正在经历this book on using AngularJS with Firebase，这导致我发布this question。我找到了解决方案，但我仍然不明白的是，API Documentation for a $firebaseArray 中的示例似乎没有将其作为异步请求处理。

var list = $firebaseArray(new Firebase(URL));

// add an item
list.$add({ foo: "bar" }).then(...);

// remove an item
list.$remove(2).then(...);

// make the list available in the DOM
$scope.list = list;

此外，书中的示例似乎也同步处理请求。

# Service
var buildingsUri = FIREBASE_URI + '/buildings';
var ref = new Firebase(buildingsUri);
var buildings = $firebaseArray(ref);

var getBuildings = function () {
  return buildings;
};

...
# Controller
$scope.buildings = syncArraySvc.getBuildings();

第一个示例中的$scope.list 和第二个示例中的$scope.buildings 在没有检查以确保请求已完成时，如何正确填充数据？

Answer 1

$add 和 $remove 方法返回承诺。 $firebaseArray() 方法返回一个添加了一些特殊函数和属性的数组。 $add 或 $remove 都不需要本地加载数据或依赖于数据的状态，因此可以同步调用它们。当然，数据仍然是异步下载的。所以，例如：

var list = $firebaseArray(new Firebase(URL));

// add an item
list.$add({ foo: "bar" }).then(function(ref) {
   console.log('added', ref.key());
});

// remove an item
list.$remove(2).then(function(ref) {
   console.log('removed', ref.key());
});

console.log('list current contains', list.length, 'items');

list.$loaded(function() {
   console.log('after loading initial data, the list contains', list.length, 'items');
});

假设列表在加载时包含 10 个项目，并且在此代码执行期间没有远程更改该列表，我们将看到类似于以下的输出：

list currently contains 0 items
after loading initial state, the list contains 10 items
added abc123
removed xyz456

另外，我注意到这段代码可能是多余的。通常当我们看到这样的代码时，是因为开发人员正试图将 Firebase 变成一个 CRUD 模型。您可能只需要在此处返回 $firebaseArray() 并使用现有的方法，例如 $getRecord() 等，而不是在您的服务中人为地包装 API。