【问题标题】:AngularJS Automatically Syncing Data between Server and ClientAngularJS 在服务器和客户端之间自动同步数据
【发布时间】:2013-03-03 06:01:31
【问题描述】:

在 AngularJS 文档中有一些我似乎无法找到的东西,或者我只是丢失了。

我正在使用 NodeJS 和 Express 在后端创建一个 Web 应用程序,并且我试图了解它如何在前端与 Angular 进行交互。特别是,我将有一个用于 Angular 的 JSON API 来从中获取信息。我希望前端始终是最新的。

我的问题是:

  • 双向数据绑定功能是否意味着 Angular($resource 或 $http) 每隔 n 自动从服务器获取数据 秒?
  • 它自然会使用长轮询、短轮询或 websocket 吗?
  • 你需要JQuery来实现服务端同步还是什么都能搞定 与角?
  • 您是否必须添加额外的代码才能实现此行为 发生?我需要使用 $timeout 吗?

我似乎找到的每个示例都涉及客户端获取数据一次。不与服务器同步数据。

【问题讨论】:

  • Angular 不管理客户端/服务器同步。如果您想定期轮询后端,则需要自己编写。为方便起见,您可以使用 $timeout(因此更新发生在摘要循环内),但您必须在自己的代码中进行范围更新。

标签: angularjs angular-resource


【解决方案1】:

AngularJS 中的双向绑定指的是数据模型($scope)和你的视图(指令)。例如,如果模型中的数据发生变化,视图将自动更新。同样,如果用户修改视图中的数据,您的模型将自动更新。

与 Web 服务的交互是通过 $http 服务模块进行的。因此,要从您的 RESTful API 中获取数据,您可以执行以下操作:

$http.get('/someUrl').success(successCallback);

$http 的完整文档位于 AngularJS site。我想你会发现它与 jQuery 的 $.ajax 方法非常相似。您可以使用 Angular 的 $timeout 服务(基本上是 setTimeout 的包装器)轻松设置 $http.get() 进行短轮询。

对于 AngularJS 客户端和服务器 API 之间的实时更新,您可能需要查看 Socket.io。它使用 node.js 在浏览器和服务器之间创建实时套接字连接,并为旧版浏览器提供后备机制(闪存、长轮询)。 GitHub 上有一个样板项目,演示了如何使用 Socket.io 设置 AngularJS: https://github.com/btford/angular-socket-io-seed

回顾一下:

双向数据绑定功能是否意味着 Angular($resource 或 $http) 每隔 n 秒自动从服务器获取数据?

不,Angular 模型和视图之间存在双向绑定。

它自然会使用长轮询、短轮询或 websockets 吗?

Angular 默认不包含任何这些。您必须自己设置它们。

您是否需要 JQuery 来实现服务器-客户端同步,或者一切都可以使用 Angular 完成?

$http 在广义上是 Angular 的 jQuery 的 $.ajax 等价物

您是否必须添加额外的代码才能使这种行为发生?我需要使用 $timeout 吗?

使用 $timeout 进行短轮询,或为长轮询和/或 websockets 推出您自己的解决方案(请参阅angular-socket-io-seed 项目)。

【讨论】:

  • 非常有帮助 - 值得一提的是,在这种情况下,“模型”是客户端。这对我来说并不明显。你知道 Angular 是否计划将 socket.io 或其他与 API 对话的方式作为库中的默认设置吗?我很惊讶他们的文档中没有提到这部分。谢谢!
  • 也许你可以找到更多关于如何在这个项目中实现这个概念的见解。虽然,它是基于 KO,但你可以得到想法:github.com/imrefazekas/knockout.sync.js
  • 您应该研究 Omnibinder - 目前是一个原型,但正在寻求处理服务器-客户端模型同步。
猜你喜欢
  • 1970-01-01
  • 2012-09-26
  • 2020-03-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-11-22
相关资源
最近更新 更多