MVVM架构~Knockoutjs系列之js接收C#数据集合的方式

返回目录

在controller里将数据拿到，并且存储到ViewBag对象里，最后在View上显示出来，这是传统的MVC开发方式，事实上引入Knockoutjs以后，这种方式还是适合的，Knockoutjs只是在前台数据绑定中做了一点调整，它不在依赖于后台具体数据，你完全可以在

最后去为它动态绑定数据，一般地，我们会为这种页面添加一个JS文件，用来获取数据，以实现前台开发人员与后台代码开发人员的分离。

从view层拿数据的方式有两种，第一是通过ViewBag,ViewData,TempData,Model等容器来存储，然后在View上直接取即可，而第二种方式是通过一个GET请求，它通常是异步的，你可以使用JQ里的getJSON,它可以方便的实现数据的获取工作，它对集合的支

持是比较好的。

方式一，通过ViewBag等容器实现的集合

 var json =@Html.Raw(Json.Encode(ViewBag.Category));

这时，json变量已经是一个Json数组了，它将C#里的IEnumable集合转换成了JSON对象

方式二，通过getJSON等方式实现异步获取

注意，异步执行，它的意思是说，你的页面在一个ajax请求时，不会去等待它，而是直接执行下面的语句，这样，对于大数据量情况下，浏览器不会假死，用户体验会好一些，但有时，开发人员在写代码时，往往会掉到AJAX的陷阱中，看下面代码：

        $.getJSON("http://localhost:2166/api/values/", function (data) {
            var Cart = function () {
                // Stores an array of lines, and from these, can work out the grandTotal
                var self = this;
                //self.lines = ko.observableArray([new CartLine()]);
                self.lines = ko.observableArray(data);
                // Operations
                self.addLine = function () { self.lines.push(new CartLine()) };
                self.removeLine = function (line) { self.lines.remove(line) };
            }
        });

        ko.applyBindings(new Cart());

不仔细看，看不出问题，但一运行程序，问题就出来了，“从服务器那边获取不到数据”，这是为什么呢，明明有数据呀，这就是AJAX的陷阱了，你的 ko.applyBindings(new Cart())没有等待上面的取数据完，就输出了，所以，什么都没有，下面是正常的代码

你可以对比一下：

        $.getJSON("http://localhost:2166/api/values/", function (data) {
            var Cart = function () {
                // Stores an array of lines, and from these, can work out the grandTotal
                var self = this;
                //self.lines = ko.observableArray([new CartLine()]);
                self.lines = ko.observableArray(data);
                // Operations
                self.addLine = function () { self.lines.push(new CartLine()) };
                self.removeLine = function (line) { self.lines.remove(line) };
            }
            ko.applyBindings(new Cart());
        });

怎么样，只是代码的位置不同，结果就完全不同吧，呵呵！所以说，我们对问题的理解程度，有时，应该有一种“模棱两不可”的精神！

返回目录