将数据从服务器绑定到淘汰赛的最佳方法答案

【问题标题】：best way to bind data from server to knockout将数据从服务器绑定到淘汰赛的最佳方法
【发布时间】：2016-12-08 21:17:52
【问题描述】：

大家好，我是 knockout.js 的新手，我很想知道将数据从服务器绑定到淘汰赛的最佳方式。例如我想绑定类别变量，然后在选择中使用：

var myViewModel = function(){
    var self = this
    self.categories = []
    $.getJson("/ajax/categories", function(r){
        self.categories = r; 
    }
}
ko.applyBindings(new myViewModel ());

// in html
<select data-bind='options: categories'> </select>

【问题讨论】：

您必须使用 () 约定分配，即 self.categories(r) 并尝试在 select 中使用 optionsText。
感谢您的回复，类别不起作用，也不起作用。这是从服务器绑定数据的最佳方式还是有更清洁的方式？
好的，我将类别更改为 observableArray 并且它可以工作，但是如果我不希望这些类别成为 observableArray 并且只是数组？有兴趣找出这种情况下的最佳方法
糟糕，我错过了！因为 self.categories 稍后是一个普通的 js 变量，即使你为它赋值（在 getJson 下），也没有办法用你的值填充下拉列表，因为它不是可观察的 Array 。普通变量不会更新您的视图（仅当您在加载时分配一些默认值而不是通过 xmlhttprequest 时才会更新）
当您通过 getJson 服务器填充类别时，最好调用它以使其成为 observableArray，这是最好的方法和唯一的方法。

标签： knockout.js

【解决方案1】：

var myViewModel = function() {
    var self = this
    self.categories = ko.observableArray([]);
    $.getJson("/ajax/categories", function(r) {
        self.categories(r); 
    }
}
ko.applyBindings(new myViewModel());

在html中

<select data-bind='options: categories'> </select>

更新 - 说明

创建“myViewModel”以便将其绑定到标记。
类别集合是通过 get 请求从服务器获取的。
请求是异步操作，因此类别数组为空时在 applyBindings 方法中敲除绑定它。
一段时间后，请求返回类别数组。
并将返回的数组放入可观察数组中。
可观察数组的内容正在改变，所有订阅者都可以通知它。
敲除绑定引擎收到有关阵列更改和重建的通知标记。

【讨论】：

如果提供了一些解释，这将是一个合适的答案（数据绑定的性质、异步、“为什么”，基本上是超酷的评论）。
@Tyblitz - 没问题。

【解决方案2】：

上面的解释看起来不错，但在 2 个地方几乎没有语法错误：

1. $.getJson 应该是$.getJSON（在大写中）
2.$.getJSON右括号不见了

其他都很好，可以从下面复制更正的代码：

var myViewModel = function() {
    var self = this
    self.categories = ko.observableArray([]);
    $.getJSON("/ajax/categories", function(r) {
        self.categories(r);
    })
}
ko.applyBindings(new myViewModel());

【讨论】：