是否可以将更新“注入”Knockout ViewModel?

时间:2014-04-22 20:13:11

标签: c# asp.net-mvc knockout.js signalr knockout-mvc

我目前正在寻找解决我的问题的方法:在我们的ASP.NET MVC应用程序中,有一些页面用于工业设备的实时数据可视化。加载页面时,会显示加载图标,同时使用数据库中所有数据点的当前值获取viewmodel数据。这很有效,但它是静态的,我的意思是在完成加载后,值不会在页面上发生变化。 Web应用程序本身使用TCP侦听器,该侦听器使用设备中的值接收消息。这些消息(基本上由设备ID,数据点id和值组成)不以固定间隔到达,而是基于事件,例如,当温度值向上或向下变化0.5 K时。

在我的页面上,我有一些图形小部件,如仪表和许多其他元素,可以正确显示从页面加载中加载的初始数据中的值。它们绑定到Knockout视图模型。

问题在于:每当新值到达服务器时,我想在页面上显示它而无需重新加载。我绝对不希望在服务器上到达的每条消息上重新传输整个视图模型的数百个数据点(每秒约1到15)。为了实现这一点,我实现了SignalR框架,它真的很棒。使用该机制,我现在在客户端窗口中收到新值(这意味着,我在Javascript中收到它,现在有一个如下所述的值对象)。

我现在需要的是:因为每个viewmodel都是动态构建的,所以它们都是不同的。两个设备的对象和属性树不同,因此每个设备都可以具有不同级别的子对象。唯一相同的是实际保存每个数据点的值的对象的结构:它总是由前面提到的设备ID,数据点id和值组成。

我需要一种方法来更新viewmodel中值对象内的double - 类型值,其设备ID和datapoint id匹配新到达的值消息(也包含这两个类似地址的ID&#39) ; s和值)。

我希望我有了这个想法。有没有办法做到这一点?这种机制的最佳做法是什么?我最近改用了Knockout-MVC(kMVC nuget包),但我也回到了"纯粹的#34; Knockout.js和一些额外的脚本如果有帮助的话。

感谢您的帮助和建议!

2 个答案:

答案 0 :(得分:1)

http://nthdegree.azurewebsites.net/mvvm-2/

以下是与Knockout mapping plugin

对话的文章

一般的想法是你应该有你的视图模型代码来加载你的模型。

您可以绑定视图模型,该模型将使用ajax调用从服务器加载属性(请参阅文章底部)。

然后,您只需使用结果

更新模型
ko.mapping.fromJS(newData, mapping, modelToUpdate)


var mapping = {}; //define your mapping (see documentation or blog post)

function ViewModel(){
    var self = this; 

    self.model = ko.mapping.fromJS({}, mapping);
    self.hub = $.connection.myHub(); 
    self.hub.client.updateModel = function(data){
       ko.mapping.fromJS(data, mapping, self.model);
    };
    self.hub.start().done(function(){
       //you could either make a call or have the "OnConnected" method trigger an 'updateModel'
    });
}

答案 1 :(得分:1)

链接到DOM元素时的ViewModel属性允许编辑实际更新KO可观察数组中的数据。您是否可以使用您认为一致的ID来更改“图形小部件”的值(假设它使用某些属性来保持高度和宽度)?

我没有测试过;另一种选择是使用KO foreach循环并更新相关值。