如何使用 SignalR 从服务器传递数组并使用 Knockout 呈现结果

Question

我正在使用 SignalR 和 KnockoutJS，似乎找不到从使用 MVC4 框架提供的数据库中获取数组的简单方法。

我从服务器发送单个对象没有问题 - 但是当我尝试发送一个数组时，我卡住了。希望有更多经验的人能够发现我所犯的可能明显的错误，并说明应该如何做到这一点（JavaScript 不是我的强项）。据我所知，问题是从服务器传递的数据的映射。非常感谢任何帮助！

SignalR Hub（orders 是一个带有 Id 和 Name 的简单表）

public class feedHub : Hub
{
    private dataContext db = new dataContext();
        public void GetAll()
        {
        var orders = db.orders.ToArray();
        Clients.getData(orders);
        }
}

显示订单的简单 HTML 代码；

<div id="Demo"> 
  <div data-bind="foreach: orders">
    <div data-bind="html: Id"></div>
    <div data-bind="html: Name"></div> 
  </div>
</div>

JavaScript

<script type="text/javascript">   

    var viewModel = {
       orders: ko.observableArray(orders)
    };


    ko.applyBindings(viewModel, $("#Demo")[0]);

    $(function () {        
        // Client side version of the feebHub class
        var hubcon = $.connection.feedHub;

        // getData called from server 
        hubcon.getData = function (data) { viewModel.orders(data) };

        // Start connection and call getAll
       $.connection.hub.start(function () { hubcon.getAll(); });

    });

</script>

Answer 1

几点：

1. 只需使用ko.observableArray()，即不带参数
2. 将ko.applyBindings 的调用放入您的就绪函数中，例如就在您获得中心参考之前

这应该足以让它工作。至少，它在我基于您的代码的this fiddle 中有效。

还有一点……您将纯 JSON 对象传递给 KO（即在您的可观察数组中）。这就像 C# 中针对某些不实现 INotifyPropertyChanged 的​​类的数据绑定。 IOW 绑定将正常工作一次，对象中的更改将永远不会反映在 UI 上。如果您希望 SignalR 将更改馈送到您的对象中，那么它们将需要具有可观察的属性，您可能需要查看 the KO mapping plugin。