实时数据绑定 JavaScript [关闭]

Question

我有这个要求，我在突破客户端技术方面不是很成功。希望有人可能已经解决了这种关于我不想再次打破我的头并浪费我的时间的难题。

我的要求是：

• 我有一个服务器，它有一个数据处理引擎，它将提供 平均每 30 秒创建一个数据库。
• 我需要一个客户端 Web 应用程序，我想在其中绘制一些图形 根据我的服务器引擎生成的数据。
• 我可以找到适合我的绘图要求的库 (Flotr2)
• 我已经为我的后端数据设置了一个带有 socket.io comm 的 Node.js 服务器 流媒体。

我可以简单地使用纯js监听socket并调用函数来绘制图形。

但是，我的应用程序必须是高度可配置的。我希望数据库中的多列数据在单个图表上绘制以满足我的要求（这意味着单个元素上有多个值）。

如果我使用纯 JavaScript 实现我的客户端，在某些时候我的代码将变得不可维护，而且我可能会重新发明现有的轮子。

所以，我正在寻找用于数据绑定的客户端库（一个值到一个元素，多个值到单个元素，多个值到多个元素）

我基本上是一个后端和移动的人，但不是 JS 人。我浏览了网页，得到了一些使用 Knockout.Js、Angular.js、Backbone.js、Meteor.js 的随机建议，我不能依赖它们。

编辑：

我已经尝试过使用 Knockout.js 进行客户端数据绑定。我坚持使用第二个和第三个用例（单个元素的多个值和多个元素的多个值）。

假设从服务器我得到 {"a":55,"b":5,"c":46} 作为数据。我有两个 HTML id 为“x”、“y”的元素。我想将值 a,b 绑定到元素“x”和 值 b，c 到元素“y”。是否可以？任何简单的小提琴都是 帮助很大。

那么，有人可以指出我正确的方向并在这里分享您的想法。

Answer 1

knockout.js- 适合将数据绑定到您的视图。学习曲线少，易于实施。

angular.js- 这是一个全栈客户端框架 (MVC/MVVM)。提供控制器、服务和模块来构建您的前端。数据绑定只是 angular.js 工作的一部分。你需要花更多的时间来学习，因为它比淘汰赛更复杂。

ember.js - 如果数据数据更新频率很高并且渲染性能对您来说是个问题，这也是一个选项。 ember 中的渲染性能比 angular.js 和 knockout.js 高得多（根据我的经验。在得出结论之前对您的数据模型、支持的浏览器进行一些测试）。

有一些更好的框架，如backbone.js 可以满足您的要求。但我对他们没有任何经验。

好读 - http://weblogs.asp.net/dwahlin/javascript-data-binding-frameworks

编辑 1：

knockout.js 计算函数可用于将多个值绑定到一个元素。

查看模型

var self = this;
self.valueA = ko.observable(55);
self.valueB = ko.otbservable(5);
self.valueC = ko.otbservable(46);
self.valueX = ko.computed(function(){
    return self.valueA() + self.valueB();
});
self.valueY = ko.computed(function(){
    return self.valueB() - self.valueC();
});

HTML

Value X, <span data-bind='text: valueX'> </span>

Value Y, <span data-bind='text: valueY'> </span>

在此处查看示例http://www.knockmeout.net/