javascript - AngularJS 与 REST 同步实时收集并获得实时更新

Question

我正在寻找一些最佳实践，了解如何使用 REST 同步集合并使用 Web 套接字获取实时更新。如果我有一个集合 items...

• {id: 1, title: "First todo", completed: false}
• {id: 2, title: "Second todo", completed: true}
• {id: 3, title: "Third todo", completed: false}

我正在为 TodoItems 定义一个 REST 资源:

app.factory('TodoItems', function($resource) {
    return $resource( '/todoitems/:id', { id: '@id' },
            {create: { method: 'POST' },
            update: { method: 'PUT' } }
});

其余资源应用于获取整个列表，但更新仅单个项目。

我可能会有某种webSocket.listenForChanges(item.id, cb)。

有了这两种获取、操作数据和获取实时更新的方法，我该如何实际使用它？

...我可以执行 $scope.$watchCollection 并在发生任何更改时获取更新，但每次我手动更改集合时回调都会运行，这不仅是由于用户更新，因为用户更新需要运行 TodoItems.update(item) 并且网络套接字更新不得触发我的 REST API。

webSocket.listenForChanges(item.id, function(newItem) { $scope.item = newItem; });
// This triggers $watchCollection - NOT GOOD, because $watchCollection
// could trigger and call upon REST

AngularFire 以某种方式做到了 http://www.youtube.com/watch?v=C7ZI7z7qnHU#t=30m28s但我怀疑他们是通过对整个阵列进行批量同步来实现的。

对每个项目 Controller 中的$watch 单个项目进行一点修改，具有以下 JADE 模板

ul
  li(ng-repeat='todo in todos',ng-controller='TodoItemController')

但是问题是一样的，$watch 无法区分服务器更新和用户更新。

我唯一的希望是仅从像 updateItem(item) removeItem(item) 这样的范围控件调用我的 REST API 还是有一些更聪明的方法来自动同步REST/websocket 上的集合？

Answer 1

您可以使用 ngChange 来监视用户更改。根据文档，它指出 ngChange 将“在用户更改输入时评估给定的表达式。当值更改来自模型时，不会评估表达式。”

我很好奇您为什么混合使用 REST API 和 WebSocket API。为什么不全部通过 WebSockets 来完成呢？它的重量更轻，而且不混合协议(protocol)似乎不会那么困惑。